[-- VAR.AdditionalImages "0" --][-- FOR VAR.I 1 20 --][-- IF PRODUCT.MoreInfoImage[VAR.I] --][-- VAR.AdditionalImages INC --][-- END_IF --][-- END_FOR --]
<style type="text/css">.clear{clear:both}.hidden{display:none!important}.row_img img,#prod_img{max-width:100%}.flex2>div{max-width:50%}.flex3>div{max-width:33%}.flex4>div{max-width:25%}.flex5>div{max-width:20%}.flex6>div{max-width:16%}.flex7>div{max-width:14%}.flex8>div{max-width:12.5%}.flex9>div{max-width:11%}.flex10>div{max-width:10%}.row_img{margin-top:6px;clear:left}.row_img a{display:inline-block;margin-top:2px;margin-right:2px}.row_img .d-flex>div:last-child a{margin-right:0px !important}#gallery img{border:1px solid transparent;opacity:.7;filter:opacity(70)}a.zoomGalleryActive img{border:1px solid #[-- STORE.LinkColor --] !important;opacity:1!important;filter:opacity(100)!important}img#cj-miimage {background: #FFFFFF; max-width: 100%}div#carouselMoreInfo .carousel-item a, div#prod_img a {display: block;text-align: center;width: 100%}div#carouselMoreInfo .carousel-item img, div#prod_img img {margin:0px auto;max-width:100%}div#carouselMoreInfo .carousel-indicators {position:relative;bottom:0px;margin-top:15px}div#carouselMoreInfo .carousel-indicators li {background-color:#[-- STORE.Color4 --]}div#carouselMoreInfo .carousel-indicators li.active {background-color:#[-- STORE.LinkColor --]}@media screen and (max-width:768px) {body.circle div#carouselMoreInfo .carousel-indicators li,body.rounded div#carouselMoreInfo .carousel-indicators li {height:12px;max-width:12px;border-radius:50%}}@media screen and (min-width:768px){div#carouselMoreInfo .carousel-indicators li {height:60px;max-width:60px;text-indent:0px;border:1px solid transparent;background-color:transparent !important}body.bordersthick div#carouselMoreInfo .carousel-indicators li {border:2px solid transparent}div#carouselMoreInfo .carousel-indicators li.active {border:1px solid #[-- STORE.Color4 --]}body.bordersthick div#carouselMoreInfo .carousel-indicators li.active {border:2px solid #[-- STORE.Color4 --]}div#carouselMoreInfo .carousel-indicators span {display: block;height: 100%;background-color:#FFF;background-position: center;background-size: contain;background-repeat: no-repeat}}</style>
[-- IF PRODUCT.MoreInformationGraphic --]
[-- IF STORE.ImageZoom --][-- VAR.NumberPerRow 1 --][-- VAR.MaxNumberPerRow Store.ImageRowCnt --][-- VAR.ThumbSize STORE.ImageZoomThumbSize --][-- VAR.RegSize STORE.ImageZoomProductSize --][-- VAR.LargeSize STORE.ImageZoomZoomSize --]
<div class="clearfix prod_img"><img src="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.RegSize] URL_ONLY --]" alt="[-- IF PRODUCT.MoreInformationGraphicDesc --][-- PRODUCT.MoreInformationGraphicDesc --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --][-- END_IF --]" name="prod_img" id="prod_img" data-zoom-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.LargeSize] URL_ONLY --]"></div>
<div class="row_img" id="gallery"><div class="d-flex flex[-- Store.ImageRowCnt --]">
[-- IF VAR.AdditionalImages GT 0 --]<div><a href="#" id="prod_img_main1" class="hidden" data-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.RegSize] URL_ONLY --]" data-zoom-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.LargeSize] URL_ONLY --]"><img src="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.ThumbSize] URL_ONLY --]" alt="[-- IF PRODUCT.MoreInformationGraphicDesc --][-- PRODUCT.MoreInformationGraphicDesc --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --][-- END_IF --]"></a><a href="#" id="prod_img_main" class="hidden" data-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.RegSize] URL_ONLY --]" data-zoom-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.LargeSize] URL_ONLY --]"><img src="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.ThumbSize] URL_ONLY --]" alt="[-- IF PRODUCT.MoreInformationGraphicDesc --][-- PRODUCT.MoreInformationGraphicDesc --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --][-- END_IF --]"></a><a href="#" class="zoomGalleryActive" data-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.RegSize] URL_ONLY --]" data-zoom-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.LargeSize] URL_ONLY --]"><img src="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.ThumbSize] URL_ONLY --]" alt="[-- IF PRODUCT.MoreInformationGraphicDesc --][-- PRODUCT.MoreInformationGraphicDesc --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --][-- END_IF --]"></a></div>
[-- FOR VAR.I 1 20 --][-- IF PRODUCT.MoreInfoImage[VAR.I] --][-- IF VAR.NumberPerRow VAR.MaxNumberPerRow --][-- VAR.NumberPerRow 0 --]</div><div class="clear"></div><div class="d-flex flex[-- Store.ImageRowCnt --]">[-- END_IF --][-- VAR.NumberPerRow INC --]<div><a href="#" data-image="[-- PRODUCT.MoreInfoImage[VAR.I] SS_SIZE[VAR.RegSize] URL_ONLY --]" data-zoom-image="[-- PRODUCT.MoreInfoImage[VAR.I] SS_SIZE[VAR.LargeSize] URL_ONLY --]"><img src="[-- PRODUCT.MoreInfoImage[VAR.I] SS_SIZE[VAR.ThumbSize] URL_ONLY --]" alt="[-- IF PRODUCT.MoreInfoImageDesc[VAR.I] --][-- PRODUCT.MoreInfoImageDesc[VAR.I] --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --] [-- VAR.I --][-- END_IF --]"></a></div>[-- END_IF --][-- END_FOR --]
[-- ELSE_IF PRODUCT.OptionFiniteText --][-- IF PRODUCT.UseNewOption --]<div><a href="#" id="prod_img_main1" class="hidden" data-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.RegSize] URL_ONLY --]" data-zoom-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.LargeSize] URL_ONLY --]"><img src="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.ThumbSize] URL_ONLY --]" alt="[-- IF PRODUCT.MoreInformationGraphicDesc --][-- PRODUCT.MoreInformationGraphicDesc --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --][-- END_IF --]"></a><a href="#" id="prod_img_main" class="hidden" data-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.RegSize] URL_ONLY --]" data-zoom-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.LargeSize] URL_ONLY --]"><img src="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.ThumbSize] URL_ONLY --]" alt="[-- IF PRODUCT.MoreInformationGraphicDesc --][-- PRODUCT.MoreInformationGraphicDesc --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --][-- END_IF --]"></a><a href="#" class="zoomGalleryActive" data-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.RegSize] URL_ONLY --]" data-zoom-image="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.LargeSize] URL_ONLY --]"><img src="[-- PRODUCT.MoreInformationGraphic SS_SIZE[VAR.ThumbSize] URL_ONLY --]" alt="[-- IF PRODUCT.MoreInformationGraphicDesc --][-- PRODUCT.MoreInformationGraphicDesc --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --][-- END_IF --]"></a></div>[-- END_IF --]
[-- END_IF --]</div></div>
#####
[-- ELSE_IF VAR.AdditionalImages NE 0 --]<div id="carouselMoreInfo" class="carousel slide" data-ride="false">
  <div class="carousel-inner">
    <div class="carousel-item active"><a id="carousel-main" href="#" onclick="return miGPop('[-- PRODUCT.MoreInformationGraphic SS_SIZE0 URL_ONLY --]')"><img src="[-- PRODUCT.MoreInformationGraphic URL_ONLY --]" alt="[-- IF PRODUCT.MoreInformationGraphicDesc --][-- PRODUCT.MoreInformationGraphicDesc --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --][-- END_IF --]" name="prod_img"></a></div>
[-- FOR VAR.I 1 20 --][-- IF PRODUCT.MoreInfoImage[VAR.I] --]<div class="carousel-item"><a href="#" onclick="return miGPop('[-- PRODUCT.MoreInfoImage[VAR.I] SS_SIZE0 URL_ONLY --]')">[-- PRODUCT.MoreInfoImage[VAR.I] SS_SIZE1 ONLY_ALT_TAG --]</a></div>[-- END_IF --][-- END_FOR --]
  </div>
  <a class="carousel-control-prev" href="#carouselMoreInfo" role="button" data-slide="prev"><span class="carousel-control-prev-icon" aria-hidden="true"></span><span class="sr-only">Prev</span></a>
  <a class="carousel-control-next" href="#carouselMoreInfo" role="button" data-slide="next"><span class="carousel-control-next-icon" aria-hidden="true"></span><span class="sr-only">Next</span></a>
  <ol class="carousel-indicators">[-- VAR.IndicatorCount 0 --]
    <li data-target="#carouselMoreInfo" data-slide-to="[-- VAR.IndicatorCount --][-- VAR.IndicatorCount INC --]" class="active" id="prod-img-main"><span style="background-image:url([-- PRODUCT.MoreInformationGraphic URL_ONLY --])"></span></li>
[-- FOR VAR.I 1 20 --][-- IF PRODUCT.MoreInfoImage[VAR.I] --]<li data-target="#carouselMoreInfo" data-slide-to="[-- VAR.IndicatorCount --][-- VAR.IndicatorCount INC --]"><span style="background-image:url([-- PRODUCT.MoreInfoImage[VAR.I] SS_SIZE3 URL_ONLY --])"></span></li>[-- END_IF --][-- END_FOR --]
  </ol>
</div>
#####
[-- ELSE --]
<div id="prod_img"><a href="#" onclick="return miGPop('[-- PRODUCT.MoreInformationGraphic SS_SIZE0 URL_ONLY --]')"><img src="[-- PRODUCT.MoreInformationGraphic URL_ONLY --]" alt="[-- IF PRODUCT.MoreInformationGraphicDesc --][-- PRODUCT.MoreInformationGraphicDesc --][-- ELSE --][-- PRODUCT.Name REMOVE_HTML --][-- END_IF --]" name="prod_img"></a></div>
[-- END_IF --]<!-- store.zoom -->
#
[-- ELSE_IF PRODUCT.Graphic --]
##########################
<div id="prod_img"><a href="#" onclick="return miGPop('[-- PRODUCT.Graphic SS_SIZE0 URL_ONLY --]')"><img src="[-- PRODUCT.Graphic URL_ONLY --]" [-- IF PRODUCT.GraphicDesc --]alt="[-- PRODUCT.GraphicDesc --]"[-- ELSE --]alt="[-- PRODUCT.Name REMOVE_HTML --]"[-- END_IF --] name="prod_img"></a></div>
[-- END_IF --]