Ooyala Player using Gumby and Bootstrap Modals. With Gumby, you're going to be fighting some default styles, so you'll want to use !important tags on the .video class for padding-bottom and height.

ooyala-bootstrap-modal.html

<style>
/* Responsive Ooyala Player */
.ooyalacon {position: relative; width: 100%; padding: 56.25% 0 0 0;} /* 56.25% = 16:9 ratio */
	.ooyalacon .innerWrapper {position: absolute !important; top: 0; left: 0; width: 100%; height: 100%;}
		.ooyalacon .video {position: absolute; top: 0; padding-bottom: 0 !important; height: 100% !important;}
</style>

<script src='http://player.ooyala.com/v3/MzZiMzc1ZDUzZGVlYmMxNzA3Y2MzNjBk'></script> <!-- Branding ID here -->

<script>
	jQuery(document).ready(function() {
		if ( typeof OO !== 'undefined' ) {
			var thismovieplayer = OO.Player.create('playerwrapper', jQuery('#playerwrapper').data('ooyala'), {
				height:'100%',
				width:'100%'
			});

			jQuery('#videomodal').on('hidden.bs.modal', function() {
				thismovieplayer.pause();
			});
		}
	});
</script>

<div class="modal fade" id="videomodal" tabindex="-1" role="dialog" aria-labelledby="videomodalLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-body">
				<div class="ooyalacon">
					<div id="playerwrapper" data-ooyala="44azdwNDpSWUvfd8F30d55tXY0YH9njH"></div> <!-- Embed Code (Asset ID) here -->
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
			</div>
		</div>
	</div>
</div>

<a chref="#" data-toggle="modal" data-target="#videomodal">Play Video</a>

ooyala-gumby-modal.html

<style>
/* Responsive Ooyala Player */
.ooyalacon {position: relative; width: 100%; padding: 56.25% 0 0 0;} /* 56.25% = 16:9 ratio */
	.ooyalacon .innerWrapper {position: absolute !important; top: 0; left: 0; width: 100%; height: 100%;}
		.ooyalacon .video {position: absolute; top: 0; padding-bottom: 0 !important; height: 100% !important}
</style>

<script src='http://player.ooyala.com/v3/MzZiMzc1ZDUzZGVlYmMxNzA3Y2MzNjBk'></script> <!-- Branding ID here -->

<script>
	jQuery(document).ready(function() {
		if ( typeof OO !== 'undefined' ) {
			var thismovieplayer = OO.Player.create('playerwrapper', jQuery('#playerwrapper').data('ooyala'), {
				height:'100%',
				width:'100%'
			});

			jQuery(document).on('click', '.simplemodal-close', function(){ //Need Gumby modal close event trigger here
				thismovieplayer.pause();
			});
		}
	});
</script>

<div class="modal" id="modal1">
	<div class="content">
		<a class="close switch" gumby-trigger="|#modal1"><i class="icon-cancel" /></i></a>
		<div class="row">
			<div class="sixteen columns centered text-center">
				<div class="ooyalacon">
					<div id="playerwrapper" data-ooyala="44azdwNDpSWUvfd8F30d55tXY0YH9njH"></div> <!-- Embed Code (Asset ID) here -->
				</div>
			</div>
		</div>
	</div>
</div>

<p class="btn primary medium">
	<a href="#" class="switch" gumby-trigger="#modal1">Play Video</a>
</p>