Fullscreen modal.
The code to generate the component is this:
<button class="btn btn-danger btn-modal" data-toggle="modal" data-target="#modal02">Open Modal</button>
<!-- modal -->
<div id="modal02" class="modal-fullsreen modal animated bounceIn" tabindex="-1" role="dialog" aria-hidden="true">
<!-- dialog -->
<div class="modal-dialog">
<!-- content -->
<div class="modal-content">
<!-- body -->
<div class="modal-body">
<div class="modal-cta">
<h2>SMART exercises are helping ordinary people to lose weight</h2>
<p>Maximum 15 minutes daily and without any equipment. Losing weight quickly in the comfort of home <strong> has become a reality. </strong></p>
</div>
<div class="modal-product">
<div class="video-player video-player-warning" itemprop="video" itemscope itemtype="http://schema.org/VideoObject">
<meta itemprop="duration" content="T1M33S">
<meta itemprop="thumbnail" content="https://img.youtube.com/vi/tP4GB0r-uwQ/0.jpg">
<span class="d-none" itemprop="name">Títle</span>
<span class="d-none" itemprop="description">Description</span>
<div id="player03" data-plyr-provider="youtube" data-plyr-embed-id="tP4GB0r-uwQ" class="uikit-video-player"></div>
</div>
</div>
<form method="post" action="" class="form-validate">
<div class="form-group">
<input class="form-control form-control-lg" type="email" placeholder="Enter your email here ..." id="email" required="required">
<button class="btn btn-lg btn-primary btn-block" type="submit">
YEA! I WANT TO START NOW
</button>
</div>
</form>
</div>
<!-- body -->
<!-- footer -->
<div class="modal-footer">
<a href="#" data-dismiss="modal">Close</a>
</div>
<!-- footer -->
</div>
<!-- content -->
</div>
<!-- dialog -->
</div>
<!-- modal -->