I need my Bootstrap 4 navbar to be displayed over all elements. However, when I use a Carousel in the body, the navbar-collapse gets hidden.
NAVBAR - HTML
<nav class="navbar navbar-expand-md navbar-dark bg-main">
<a class="navbar-brand d-md-none order-1" style="font-size:26px;line-height:0" href="#">【K】【S】【J】</a>
<button class="navbar-toggler" type="button">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse d-flex flex-column flex-row flex-lg-row flex-xl-row justify-content-lg-end bg-main p-3 p-lg-0 mt-5 mt-lg-0 mobileMenu" id="navbarSupportedContent">
<ul class="navbar-nav d-flex d-flex justify-content-around text-right px-3" dir="rtl">
<li class="nav-item active" style="">
<a class="nav-link" href="#">
<span>Home</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<span>About</span>
</a>
</li>
</ul>
</div>
</nav>