I am new to Stack Overlow. I am having some issues with this bootstrap template that I have modified for a work website I am creating. When on mobile, the navigation closes when I try to open one of the submenus. I am a bit of a newbie to coding so please excuse my ignorance. I have tried researching this but have come up short with a solution. The website is http://aventurasecure.com/. Thanks in advance for any help and again please pardon my newbieness. The code for the menu is below.
<!-- Navigation -->
<nav id="mainNav" class="navbar navbar-default navbar-fixed-top navbar-custom">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="logo-wrapper"
<a class="navbar-brand" href="#"><img src="img/Aventura_Logo1.png"></a>
</div>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<div class="nav-center">
<ul class="nav navbar-nav">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Products<span class="caret"></span></a>
<ul class="dropdown-menu multi-level" role="menu" aria-labelledby="dropdownMenu">
<li class="dropdown-submenu">
<a tabindex="-1" href="#">Cameras</a>
<ul class="dropdown-menu">
</li>
<li><a href="#">IP Cameras</a></li>
<li class="divider"></li>
<li><a href="#">Analog HD Cameras</a></li>
<li class="divider"></li>
<li><a href="#">Body Worn Cameras</a></li>
<li class="divider"></li>
<li><a href="#">ANPR Cameras</a></li>
<li class="divider"></li>
<li><a href="#">Long Range Systems</a></li>
</ul>
</li>
<li class="divider"></li>
<li class="dropdown-submenu">
<a tabindex="-1" href="#">Video Management</a>
<ul class="dropdown-menu">
</li>
<li><a href="#">Network Video Recorders</a></li>
<li class="divider"></li>
<li><a href="#">Digital Video Recorders (HD)</a></li>
<li class="divider"></li>
<li><a href="#">License Plate Recognition (ANPR)</a></li>
<li class="divider"></li>
<li><a href="#">Encoders/Decoders</a></li>
<li class="divider"></li>
<li><a href="#">Central Management</a></li>
<li class="divider"></li>
<li><a href="#">Client Remote Workstation</a></li>
<li class="divider"></li>
<li><a href="#">Matrix Systems</a></li>
<li class="divider"></li>
<li><a href="#">Mobile Systems</a></li>
<li class="divider"></li>
<li><a href="#">Video Storage Servers</a></li>
<li class="divider"></li>
<li><a href="#">Video Wall Controllers</a></li>
<li class="divider"></li>
<li><a href="#">Under Vehicle Surveillance</a></li>
</ul>
</li>
<li class="divider"></li>
<li class="dropdown-submenu">
<a tabindex="-1" href="#">Physical Security</a>
<ul class="dropdown-menu">
</li>
<li><a href="#">Access Control</a></li>
<li class="divider"></li>
<li><a href="#">Intercom & PA Systems</a></li>
<li class="divider"></li>
<li><a href="#">Ground Based Radar</a></li>
<li class="divider"></li>
<li><a href="#">Guard Tour Security Systems</a></li>
<li class="divider"></li>
<li><a href="#">Key Management Systems</a></li>
<li class="divider"></li>
<li><a href="#">Perimeter Intrusion</a></li>
<li class="divider"></li>
<li><a href="#">Road Barriers and Bollards</a></li>
<li class="divider"></li>
<li><a href="#">Turnstiles</a></li>
<li class="divider"></li>
<li><a href="#">Parking Management</a></li>
<li class="divider"></li>
<li><a href="#">Perimeter Intrusion (PIDS)</a></li>
<li class="divider"></li>
<li><a href="#">XRay Security Scanners</a></li>
</ul>
</li>
<li class="divider"></li>
<li class="dropdown-submenu">
<a tabindex="-1" href="#">Accessories</a>
<ul class="dropdown-menu">
</li>
<li><a href="#">Housings</a></li>
<li><a href="#">Lenses</a></li>
<li><a href="#">Brackets</a></li>
<li><a href="#">IR Illuminators</a></li>
<li><a href="#">Cables and Connectors</a></li>
<li><a href="#">Distribution Amplifiers</a></li>
<li><a href="#">Network Systems</a></li>
<li><a href="#">Fiber Optics (Analog)</a></li>
<li><a href="#">Fiber Optics (IP)</a></li>
<li><a href="#">Wireless Systems</a></li>
<li><a href="#">UTP Transmission</a></li>
<li><a href="#">IP over Coax</a></li>
</ul>
</li>
<li class="divider"></li>
<li class="dropdown-submenu">
<a tabindex="-1" href="#">Software</a>
<ul class="dropdown-menu">
</li>
<li><a href="#">Video Management</a></li>
<li><a href="#">Face Recognition</a></li>
<li><a href="#">License Plate Recognition</a></li>
<li><a href="#">PSIM</a></li>
<li><a href="#">Video Analytics</a></li>
<li><a href="#">Software Development kits</a></li>
</ul>
</li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Markets<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Military</a></li>
<li class="divider"></li>
<li><a href="#">Law Enforcement</a></li>
<li class="divider"></li>
<li><a href="#">Transportation</a></li>
<li class="divider"></li>
<li><a href="#">Education</a></li>
<li class="divider"></li>
<li><a href="#">Homeland Defense</a></li>
<li class="divider"></li>
<li><a href="#">Critical Infrastructure</a></li>
<li class="divider"></li>
<li><a href="#">Government</a></li>
<li class="divider"></li>
<li><a href="#">Industry</a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Support<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">DVRs</a></li>
<li class="divider"></li>
<li><a href="#">Cameras & Lenses</a></li>
<li class="divider"></li>
<li><a href="#">Cabling</a></li>
<li class="divider"></li>
<li><a href="#">Connection Diagrams</a></li>
<li class="divider"></li>
<li><a href="#">Tools</a></li>
</ul>
</li>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">About Us<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Company Info</a></li>
<li class="divider"></li>
<li><a href="#">Client List</a></li>
<li class="divider"></li>
<li><a href="#">Services</a></li>
<li class="divider"></li>
<li><a href="#">Resources</a></li>
<li class="divider"></li>
<li><a href="#">Careers</a></li>
<li class="divider"></li>
<li><a href="#">Partners</a></li>
<li class="divider"></li>
<li><a href="#">Events</a></li>
</ul>
</li>
</ul>
</div>
<ul class="nav navbar-nav navbar-right">
<li><form class="navbar-form navbar-left" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search">
</div>
</form></li>
<li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
</ul>
</div>
</div>
</nav>
