JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://www.marbellasunrentals.com/includes/jquery-1.11.1.min.js"></script>
<script src="http://www.marbellasunrentals.com/includes/fotorama.js"></script>
<link rel="stylesheet" href="http://www.marbellasunrentals.com/css/fotorama.css">
<base href="http://www.marbellasunrentals.com/sales/imagenes/properties/101/">
<!-- Fotorama -->
<div class="fotorama fotorama_custom" id="start-n-stop" data-stop-autoplay-on-touch="true" data-max-width="100%" data-nav="thumbs" data-allowfullscreen="native" data-loop="true" data-transition="crossfade" data-keyboard="true" data-arrows="always">
    <img src="47-property.jpg">
    <img src="48-property.jpg">
    <img src="49-property.jpg">
    <img src="50-property.jpg">
    <img src="51-property.jpg">
</div>
<div id="fotorama-control">

</div>

CSS

#fotorama-control {height: 40px; width:100%; margin: 0 0 0 0; position: relative; background-color:#FF6}

JavaScript

// 1. Initialize fotorama manually.
    var $fotoramaDiv = jQuery('.fotorama_custom').fotorama();

    // 2. Get the API object.
    var fotorama = $fotoramaDiv.data('fotorama');


    if (jQuery('.fotorama_custom__arr').length > 0) {
        jQuery('.fotorama_custom__arr').remove();
    }

jQuery("<span class='fotorama_custom__arr--prev'><</span>").insertAfter(".fotorama__nav-wrap");
    jQuery("<span class='fotorama_custom__arr--next'>></span").insertAfter(".fotorama__nav-wrap");
    jQuery("<span class='fotorama_custom__arr--last'>>></span>").insertAfter(".fotorama__nav-wrap");
    jQuery("<span class='fotorama_custom__fullscreen-icon'>x</span>").insertAfter(".fotorama__nav-wrap");
    jQuery("<span class='fotorama_custom__buttonplay'>P</span>").insertAfter(".fotorama__nav-wrap");
    jQuery("<span class='fotorama_custom__buttonstop'>S</span>").insertAfter(".fotorama__nav-wrap");
  jQuery('.fotorama_custom__arr--prev').click(function () {
        fotorama.show('<');
    });
    jQuery('.fotorama_custom__arr--next').click(function () {
        fotorama.show('>');
    });
  jQuery('.fotorama_custom__arr--last').click(function () {
        fotorama.show('>>');
    });
   jQuery('.fotorama_custom__fullscreen-icon').click(function () {
                          fotorama.requestFullScreen();
  
});
$(function () {
		var $fotorama = $('#start-n-stop'),
				fotorama = $fotorama.data('fotorama'),
				$thumbBorder = $('.fotorama__thumb-border', $fotorama),
				thumbBorderColor = $thumbBorder.css('border-color'),
				thumbBackground = $thumbBorder.css('background'),
				$start = $('#start'),
				$stop = $('#stop');
		// Visual response
		$fotorama.on('fotorama:startautoplay fotorama:stopautoplay', function (e, fotorama) {
			$start.attr('disabled', !!fotorama.autoplay);
			$thumbBorder.css({
				borderColor: fotorama.autoplay ? 'rgb(0, 200, 0)' : thumbBorderColor,
				background: fotorama.autoplay ? 'rgba(100, 200, 100, .25)' : thumbBackground
			});
		});
		// API...