{load_language_text section="buttons" name="button"}

{block name="lightbox_gallery"}
	<div id="lightbox_gallery_container" style="width: {$content_data.GALLERY_WIDTH}px;">
		<div id="lightbox_gallery" style="width: {$content_data.GALLERY_WIDTH}px;">
			<div id="lightbox_gallery_inner">
				{block name="lightbox_gallery_close"}
					<div style="position:relative;">
						<div class="lightbox_close"><a href="{page_url}#" class="icon_lightbox_close" title="{$button.close}">&nbsp;</a></div>
					</div>
				{/block}
				
				{block name="lightbox_gallery_main"}
					<div id="lightbox_gallery_main" style="height: {$content_data.IMAGE_MAX_HEIGHT}px; background-image: url('{$content_data.images_data.0.IMAGE}');">
						<div class="lightbox_gallery_left"><a href="{page_url}#" class="icon_gallery_back" title="{$button.back_small}">&nbsp;</a>
							<div class="lightbox_gallery_right"><a href="{page_url}#" class="icon_gallery_next" title="{$button.next_small}">&nbsp;</a></div>
						</div>
					</div>
				{/block}
				
				{block name="lightbox_gallery_thumbnails"}
					<div id="lightbox_gallery_thumbnails">
						{foreach name=thumbnails item=thumbnails_data from=$content_data.images_data}
							{block name="lightbox_gallery_thumbnail"}
								<div class="thumbnail">
									<a href="{$thumbnails_data.IMAGE}" class="button_product_images" id="gallery_inside_thumbnail_{$smarty.foreach.thumbnails.iteration}">
										{block name="lightbox_gallery_thumbnail_image"}
											<img style="padding-left: {$thumbnails_data.THUMBNAIL_PADDING_LEFT}px; padding-top: {$thumbnails_data.THUMBNAIL_PADDING_TOP}px;" src="{$thumbnails_data.THUMBNAIL}" alt="{$thumbnails_data.IMAGE_ALT|default:$thumbnails_data.PRODUCTS_NAME}" title="{$thumbnails_data.IMAGE_ALT|default:$thumbnails_data.PRODUCTS_NAME}" />
										{/block}
									</a>
								</div>
							{/block}
						{/foreach}
					</div>
				{/block}
			</div>
		</div>
	</div>
{/block}