#mobile-scroll-menu.scroll {
  white-space: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}

#mobile-scroll-menu.scroll::-webkit-scrollbar {
  display: none;
}

#mobile-scroll-menu.sticky {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999999;
}

.admin-bar #mobile-scroll-menu.sticky {
  top: 32px;
}

#mobile-scroll-menu {
  background: url('../img/HP-Leaf-Divider-Bar.jpg');
  background-size: cover;
  background-repeat: no-repeat;
}

#mobile-scroll-menu nav {
  vertical-align: middle;
}

#mobile-scroll-menu nav.preview {
  animation: preview 1.5s ease-in-out 4s;
}

#mobile-scroll-menu a {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
	font-weight: 600!important;
  color: #fff;
  line-height: 1.5;
  padding: 12px 16px 13px;
  transition: all 0.15s ease-in-out;
  background-color: rgba(255, 255, 255, 0);
  text-decoration: none;
}

#mobile-scroll-menu a:hover {
  background-color: rgba(255, 255, 255, 0.15);
}

@keyframes preview {
  0% {
    margin-left: 0;
    opacity: 1;
  }

  60% {
    margin-left: -40px;
    opacity: 0.7;
  }

  75% {
    margin-left: -40px;
    opacity: 0.7;
  }

  100% {
    margin-left: 0;
    opacity: 1;
  }
}

@media (min-width: 980px) {
  #mobile-scroll-menu {
    display: none;
  }
}

@media (max-width: 782px) {
  .admin-bar #mobile-scroll-menu.sticky {
    top: 46px;
  }
}