I am having a problem I have setup an navigation menu to show when it is not in mobile view but its doesn't show up but when I go into mobile view and press my navigation button all my pages show up. Now when I go back into desktop mode it all working, so I was wondering what could be causing the navigation not to work in desktop mode.

here is my index.php and style.css.

```css
/*
Template Name          : Electronics Hub
Author Name            : Marcus
Author Email           : *******.iinet.net.au
Theme URL              : www.electronicshub.tech / localhost/electronicshub
Theme Ver              : 1.1
*/

/* General Style */

body{
 font-size: 14px;
 line-height: 1.42857143;
 color: #333333;
 background: #f0f0f0;
 overflow-x: hidden;
}

/* Top Styles */

#top{
 background: #555555;
 padding: 10px 0;
}
#top .offer{
 color: #ffffff;
}
#top .offer .btn{
 text-transform: uppercase;
}
@media(max-width: 991px){
 #top .offer{
  margin-bottom: 10px;
 }
}
@media(max-width: 991px){
 #top{
  font-size: 12px;
  text-align: center;
 }
}
#top a{
 color: #ffffff;
}
#top ul.menu{
 padding-top: 5px;
 margin: 0px;
 text-align: right;
 font-size: 12px;
 list-style: none;
}
@media(max-width: 991px){
 #top ul.mwnu{
  text-align: center;
 }
}
#top ul.menu > li{
 display: inline-block;
}
#top ul.menu > li a{
 color: #ffffff;
}
#top ul.menu > li + li:before{
 content: "|\00a0";
 color: #f7f7f7;
 padding: 0 5px;
}
```

```html
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Electronics Hub</title>
 <link rel="stylesheet" href="styles/bootstrap-337.min.css">
 <link rel="stylesheet" href="font-awsome\css\font-awesome.min.css">
 <link rel="stylesheet" href="styles/style.css">
</head>
<body>

 <div id="top"><!-- Top Begin -->
  <div class="container"><!-- Container Begin -->
   <div class="col-md-6 offer"><!-- Col-md-6 offer Begin -->
    <a href="#" class="btn btn-success btn-sn">Welcome</a>
    <a href="checkout.php">4 times in your Cart | Cart Total Price: $300</a>
   </div><!-- Col-md-6 offer Finished -->
   <div class="col-md-6"><!-- Col-md-6 offer Begin -->
    <ul class="menu"><!-- Menu Begin -->
     <li>
      <a href="customer_register.php">Register</a>
     </li>
     <li>
      <a href="checkout.php">My Account</a>
     </li>
     <li>
      <a href="cart.php">Go to Cart</a>
     </li>
     <li>
      <a href="checkout.php">Login</a>
     </li>
    </ul><!-- Menu Finished -->
   </div><!-- Col-md-6 offer Finished -->
  </div><!-- Container Finished -->
 </div><!-- Top Finished -->

 <div id="navbar" class="navbar navbar-default"><!-- Navbar navbar-default Begin -->
  <div class="container"> <!-- Container Begin -->
   <div class="navbar-header"><!-- Navbar-header Begin -->
    <a href="index.php" class="navbar-brand home"><!-- Navbar-brand home Begin -->
     <img src="images/ecom-store-logo.png" alt="Electronicshub Logo" class="hidden-xs">
     <img src="images/ecom-store-logo-mobile.png" alt="Electronicshub Logo Mobile" class="visible-xs"></img>
    </a><!-- Navbar-brand home Finished -->
    <button class="navbar-toggle" data-toggle="collapse" data-target="#navigation">
     <span class="sr-only">Toggle Navigation</span>
     <i class="fa fa-align-justify"></i>
    </button>
    <button class="navbar-toggle" data-toggle="collapse"data-target="#search">
     <span class="sr-only">Toggle Search</span>
     <i class="fa fa-search"></i>
    </button>
   </div><!-- Navbar-header Finished -->
    <div class="navbar-collaspe collapse" id="navigation"><!-- Navbar-collaspe collapse Begin -->
     <div class="padding-nav"><!-- Padding-nav Begin -->
      <ul class="nav navbar-nav left"><!-- Nav navbar-nav left Begin -->
       <li class="active">
        <a href="index.php">Home</a>
       </li>
       <li>
        <a href="shop.php">Shop</a>
       </li>
       <li>
        <a href="checkout.php">My Account</a>
       </li>
       <li>
        <a href="cart.php">Shopping Cart</a>
       </li>
       <li>
        <a href="contact.php">Contact Us</a>
       </li>
      </ul><!-- Nav navbar-nav left Finished -->
     </div><!-- Padding-nav Finished -->
    </div><!-- Navbar-collaspe collapse Finished -->
  </div><!-- Container Finished -->
 </div><!-- Navbar navbar-default Finished -->

 <script src="js/jquery-331.min.js"></script>
 <script src="js/bootstrap-337.min.js"></script>

</body>
</html>
```

I expect the navigation menu to show up when it is in desktop mode not when I go into mobile navigation then it shows up.