I'm trying to center align vertically in my modal body, but nothing seems to be working. I am using Bootstrap version 4.3. Can anyone help me figure out what's going wrong?
<section>
<div id="search-shopkeeper-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="shopkeeperModal" aria-hidden="true">
<div class="modal-dialog modal-xl" role="document">
<div class="modal-content">
<div class="modal-header border-0 p-0 m-0">
<div class="container-fluid p-2">
<form action="">
<div class="form-row">
<div class="col-12">
<div class="input-group input-group-lg">
<div class="input-group-prepend">
<span id="search-shopkeeper-addon" class="input-group-text bg-transparent border-0"><i class="fas fa-search"></i></span>
</div>
<input type="text" class="form-control rounded-0 border-0 shadow-none" placeholder="Type the Shopkeeper's name..." aria-label="Username" aria-describedby="search-shopkeeper-addon">
</div>
</div>
</div>
</form>
</div>
</div>
<div class="modal-body" style="border: 1px red solid">
<!-- @todo -->
<div class="container d-flex align-items-center" style="border: 1px red solid">
<div><h1 class="text-center">NO RESULTS FOUND!</h1></div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default text-white shadow-none" data-dismiss="modal" style="background-color: #333333 !important">Close</button>
</div>
</div>
</div>
</div>
</section>