// Animations for the dropdown menu @-webkit-keyframes fadeInUp {

from {
  opacity: 0;
  -webkit-transform: translate3d(0, 10px, 0);
  transform: translate3d(0, 10px, 0);
}

to {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

}

@keyframes fadeInUp {

from {
  opacity: 0;
  -webkit-transform: translate3d(0, 10px, 0);
  transform: translate3d(0, 10px, 0);
}

to {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

} .navbar {

  border-radius: 0;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  background-color: $primary;
  &.bg-faded:hover {
      background-color:$primary;
  }
  &.bg-faded {
      background-color:transparent;
  }
  &.affix {
      position: fixed;
      top: 0;
      right: 0;
      left: 0;
      z-index: 1030;
      padding-top: 15px;
      padding-bottom: 15px;
      background-color: $primary;
      .nav-item > a, .navbar-brand {
          color: #fff;
      }
  }

  @include media-breakpoint-down(sm) {
      a.dropdown-item {
          padding: 1rem 0.5rem;
      }
      .collapse.show {
          background-color: $primary;
      }
  }
  img.navbar-brand {
      height: 66px;
      padding: 0 0;
  }
  .nav-link {
      font-size: 1.4rem;
      &.dropdown-toggle {
          &:hover + .dropdown-menu {
              -webkit-animation-name: fadeInUp;
              animation-name: fadeInUp;
          }
      }
  }
.dropdown.show {
      .dropdown-menu {
          opacity: 1;
      }
}
.dropdown-menu {
      opacity: 0;
      -webkit-box-shadow: 0px 0px 27px -7px rgba(0,0,0,0.75);
      -moz-box-shadow: 0px 0px 27px -7px rgba(0,0,0,0.75);
      box-shadow: 0px 0px 27px -7px rgba(0,0,0,0.75);
      margin-top: -2px;
      &:hover {
          opacity: 1;
      }
      &::before {
          border-color: rgba(184, 184, 184, 0);
          border-bottom-color: #b8b8b8;
          border-width: 6px;
          background-clip: padding-box;
          bottom: 100%;
          right: 15px;
          border: solid transparent;
          content: " ";
          height: 0;
          width: 0;
          position: absolute;
          pointer-events: none;
      }
  }
  padding-top: 30px;
  padding-bottom: 30px;
  .dropdown-toggle::after {
      display: none;
  }
  .navbar-toggler {
      border: none;
      background: transparent !important;
      .icon-bar {
          width: 22px;
          height: 2px;
          background-color: #fff;
          display: block;
          transition: all 0.2s;
          margin-top: 4px;
          &.top-bar {
              transform: rotate(45deg);
              transform-origin: 10% 10%;
          }
          &.middle-bar {
              opacity: 0;
          }
          &.bottom-bar {
              transform: rotate(-45deg);
              transform-origin: 10% 90%;
          }
      }
      &.collapsed {
          .top-bar {
              transform: rotate(0);
          }
          .middle-bar {
              opacity: 1;
          }
          .bottom-bar {
              transform: rotate(0);
          }
      }
  }

} /* navbar collapsing */ @media(max-width:34em) {

.navbar .navbar-nav>.nav-item {
    float: none;
    margin-left: .1rem;
}
.navbar .navbar-nav {
    float:none !important;
}
.navbar .collapse.in, .navbar .collapsing  {
    clear:both;
}

}