How can I make the video fill out the remaining space below, as shown in the picture below.
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.6.0/d3.min.js"></script>
<div class="container-fluid h-100 red">
<div class="row justify-content-left h-100">
<div class="col-md-4 text-center" id="yellow">
<h3 class="display-3">Sublime</h3>
<h4 class="display-4">What we do.</h4>
<p class="p-3 my-3">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Asperiores voluptates at provident fugiat ipsam voluptas illum quidem dolores pariatur, culpa, ab optio eum perferendis! Et magni doloremque voluptatem temporibus maiores?</p>
</div>
<div class="col-md-8 blue px-0">
<!--mask color-->
<div class="view">
<!--video Source-->
<video class="video-fluid" autoplay loop muted>
<source src="/videos/171003A_009_2K.mp4" type="video/mp4"></source>
</video>
<div class="mask rgba-indigo-light"></div>
</div>
</div>
</div>
</div>.video-fluid {
width: 100%;
height: auto;
}