.navigation-outer {
  background: #1D5875;
  padding: 30px 0;
}

.navigation-outer ul {
  display: flex;
  align-items: center;
  padding-left: 2rem;
}

.navigation-outer .inner h5 {
  margin: 0px;
  color: #fff;
  font-size: 20px;
  text-transform: uppercase;
  font-weight: 700;
}

.navigation-outer .inner {
  display: flex;
  align-items: center;
  color: #fff;
  flex-wrap:wrap;
}

.navigation-outer .inner ul {
  list-style-type: none;
  margin: 0;
  padding: 0 0 0 1rem;
}

.navigation-outer ul li {
  letter-spacing: .4px;
  padding: 0px 1rem 0px 1rem;
  text-transform: capitalize;
}

.navigation-outer ul li a {
  color: #fff;
  font-weight:bold;
  position:relative;
}
.navigation-outer.sticky {
  position: fixed;
  width: 100%;
  z-index:9;
      top: 0;
}
.navigation-outer ul li a:after {
    content: "";
    position: absolute;
    bottom: -32px;
    left: 0;
    right: 0;
    width: 100%;
    background: #98829A;
    height: 8px;
    opacity:0;
}
.navigation-outer ul li:hover a:after{
    opacity:1;
}




@media screen and (max-width: 991px) {
  .navigation-outer .inner h5 {
    text-align: center;
    width: 100%;
    margin-bottom: 10px;
  }
  .navigation-outer .inner ul {
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0 0 0 0rem;
  }
  .navigation-outer ul li {
    padding-left: 7px;
    padding-right: 7px;
  }
@media screen and (max-width: 475px) {
  .navigation-outer ul li a:after {
    opacity:0;
  
  }  
}