<div class="uimage uimage-<?php echo $caption_position ?> uimage-status-<?php echo $image_status ?> uimage-caption-<?php echo $caption_position ?>-<?php echo $caption_alignment ?><?php echo $gifImage ?> <?php echo $placeholder_class ?>" style="text-align: <?php echo $align ?>;">
	<div class="upfront-image-caption-container" style="margin-top:<?php echo $marginTop ?>px">
		<?php if($url) { ?>
		<a href="<?php echo $url ?>" target="<?php echo $link_target ?>">
		<?php } ?>
			<?php if($src){ ?>
			<div class="upfront-image-container">
				<img src="<?php echo $src ?>" alt="<?php echo $alternative_text ?>" title="<?php echo $image_title ?>" <?php if($imgWidth) { ?>style="width:<?php echo $imgWidth ?>;"<?php } ?>/>
			</div>
			<?php } else { ?>
				<div class="upfront-image-starting_placeholder"><p>Image placeholder</p></div>
			<?php } ?>

		<?php if($include_image_caption){// && $caption_position != 'below_image'){ ?>
		<div class="wp-caption uimage-<?php echo $caption_alignment ?> uimage-<?php echo $caption_trigger ?> uimage-padded-caption" style="background:<?php echo $captionBackground == '1' ? $background : 'rgba(255, 255, 255, 0.5)' ?>; ">
			<?php if($cover_caption) { ?>
				<div class="uimage-caption-cover">
			<?php } ?>
					<?php echo $image_caption ?>
			<?php if($cover_caption) { ?>
				</div>
			<?php } ?>
		</div>
		<?php } ?>

		<?php if($url) { ?>
		</a>
		<?php } ?>
	</div>
</div>

<?php if($gifImage){ ?>
<style>
	#<?php echo $element_id ?>.uimage-gif .upfront-image-container {
		height: <?php echo $element_size['height'] ?>px;
		width: <?php echo $element_size['width'] ?>px;
	}

	#<?php echo $element_id ?>.uimage-gif img {
		height: <?php echo $size['height'] ?>px;
		width: <?php echo $size['width'] ?>px !important;
		margin-top: <?php echo $gifTop ?>;
		margin-left: -<?php echo $gifLeft ?>;
	}
</style>
<?php } ?>
