*
{margin: 0px;padding: 0px;box-sizing: border-box; font-family: arial;}
header
{background: black;padding: 20px 0;}
.navbar {
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.navbar-toggle{
     display: none;
}
ul.navbar-nav
{
  display: flex;
}


ul.navbar-nav li a
{
  color: #fff;
  padding: 0 15px;
  text-decoration: none;
}

 .show{
     display: block !important;
}

.collapse { display: none; }
.navbar { position: relative;  border: 1px solid transparent; }
@media (min-width: 768px) {
  .navbar-header { float: left; }
}

@media (min-width: 768px) {

  .navbar-collapse.collapse { display: block !important; }
}
@media screen and (max-width: 767px){
  .navbar {
    display: block;
   
}
.header-holder
  {
    padding: 10px 15px;
  }
ul.navbar-nav
{
  display: block;
  padding: 15px;
}
     .show ul.top-menu{
         display: block !important;
         float: none;
    }
     .navbar-toggle{
         display: block;
         float: right;
         margin-top: 8px;
         background: transparent;
         border:1px solid #fff;
         color: #fff;
         cursor: pointer;
         padding: 4px 8px;
    }
     .logo{
         width: auto;
         padding: 0;
    }
     .logo img{
         width: auto;
         height: auto;
    }
     .navbar-brand{
         height: auto;
    }
     .top-menu{
         width: 100%;
         text-align: left;
         float: none;
    }
     .nav{
         width: 100% !important;
    }
     .navbar-nav > li{
         float: none;
    }
     .navbar-collapse{
         padding: 0;
    }
     .menu-area a.navbar-brand.logo{
         padding: 0;
    }
    .menu-area .navbar-nav > li > a{
         padding: 10px 0;
         display: block;
         border-bottom: 1px solid #666;
    }
}