#userweb-menu {
  z-index: 101;
  left: 0;
  text-align: left;
}

#userweb-menu a,
#userweb-menu input,
#userweb-menu li,
#userweb-menu div {
  font-family: Trebuchet MS, "Lucida Sans", Helvetica, Verdana, Arial,
    sans-serif;
  padding: 0;
  margin: 0;
  font-size: 12px;
}

#userweb-menu li {
  display: block;
}

#userweb-menu div.menu-container {
  display: inline-block;
}

#userweb-menu div.menu-container img.icon {
  vertical-align: text-bottom;
  padding-right: 3px;
}

#userweb-menu div.menu-container a.main-menu.community-apporchard {
  display: none;
}

#userweb-menu a.main-menu.show-main-menu-items,
#userweb-menu div.menu-container > div.search-term-holder {
  display: none;
}

#userweb-menu,
#userweb-menu div.userweb-profile {
  position: absolute;
  top: 0;
  right: 0;
  height: 30px;
  white-space: nowrap;
  background: #f5f5f5;
  font-size: 0;
}

#userweb-menu a.main-menu {
  vertical-align: middle;
  font-size: 12px;
  color: #555;
  display: inline-block;
  text-decoration: none;
  outline: none;
  cursor: pointer;
  height: 30px;
  line-height: 30px;
  padding: 0 8px;
  font-weight: normal;
}

#userweb-menu a.main-menu:hover,
#userweb-menu.browsing a.browse {
  color: #8e8e8e;
  background-color: #fcfcfc;
}

#userweb-menu a.userweb-logo {
  width: 85px;
  height: 30px;
  background-image: url(/Images/UserWeb-Logo.png?ver=1.0.7611.37978);
  background-size: 85px;
  background-repeat: no-repeat;
  background-position: center center;
  float: left;
  box-sizing: content-box;
}

#userweb-menu a.userweb-logo.qa {
  background-image: url(/Images/UserWeb-QA-Logo.png?ver=1.0.7611.37978);
}

#userweb-menu a.userweb-logo:hover {
  opacity: 0.75;
}

#userweb-menu div.search-term-holder {
  display: inline-block;
  position: relative;
  margin: 0 8px;
  vertical-align: middle;
}

#userweb-menu input.search-term,
#userweb-menu select.search-source {
  border: 1px solid #c5c5c5;
  padding: 2px 24px 2px 35px;
  width: 180px;
  height: 22px;
  background-color: White;
  border-radius: 3px;
  outline: none;
  font-size: 12px;
  box-sizing: content-box;
  margin: 1px 0;
  display: inline-block;
}

#userweb-menu input.search-term.app-orchard-search {
  width: 230px;
  padding-left: 4px;
}
/* placeholder styles for the search box */
#userweb-menu input.search-term::-webkit-input-placeholder {
  color: #ccc;
}

#userweb-menu input.search-term:-moz-placeholder {
  color: #ccc;
  opacity: 1;
}

#userweb-menu input.search-term::-moz-placeholder {
  color: #ccc;
  opacity: 1;
}

#userweb-menu input.search-term:-ms-input-placeholder {
  color: #ccc;
}

#userweb-menu select.search-source {
  padding: 0;
  width: 35px;
  background-position: left;
  background-size: 16px;
  text-indent: 35px;
  background-repeat: no-repeat;
}

#userweb-menu a.userweb-menu-search {
  display: block;
  position: absolute;
  top: 5px;
  right: 0;
  bottom: 0;
  width: 22px;
  height: 22px;
  background: transparent url("/Images/search_small.png?ver=1.0.7611.37978")
    no-repeat center center;
  padding: 0;
  cursor: pointer;
}

#userweb-menu input.search-term:hover + a,
#userweb-menu input.search-term:focus + a {
  opacity: 0.5;
}

#userweb-menu a.main-menu.userweb-divot,
#userweb-menu a.search-source-options.userweb-divot {
  background-image: url("/Images/arrowDown.png?ver=1.0.7611.37978");
  background-repeat: no-repeat;
  background-position: right center;
  padding-right: 12px;
}

#userweb-menu a.search-source-options.userweb-divot {
  cursor: pointer;
  padding-bottom: 9px;
  padding-top: 9px;
  padding-right: 30px;
  position: relative;
  left: 30px;
}

#userweb-menu a.search-source-options.userweb-divot span.icon {
  background-size: contain;
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 5px;
  top: 8px;
}

#userweb-menu a.search-source-options.userweb-divot span.icon.option-0,
#userweb-menu div.search-source-options > a.option-0,
#userweb-menu select.search-source.option-0 {
  background-image: url("/Images/Galaxy-fav-icon.png?ver=1.0.7611.37978");
}

#userweb-menu a.search-source-options.userweb-divot span.icon.option-1,
#userweb-menu div.search-source-options > a.option-1,
#userweb-menu select.search-source.option-1 {
  background-image: url("/Images/UserWeb-fav-icon.png?ver=1.0.7611.37978");
}

#userweb-menu.browsing a.browse.userweb-divot {
  background-image: url("/Images/arrowUp.png?ver=1.0.7611.37978");
}

#userweb-menu div.browse,
#userweb-menu div.userweb-options,
#userweb-menu div.search-source-options {
  display: none;
  border-top: none;
  position: absolute;
  top: 30px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

#userweb-menu.browsing div.browse {
  display: inline-block;
  padding: 10px 16px;
  background-color: #fcfcfc;
  border: 1px solid #ddd;
  border-top: none;
}

#userweb-menu div.userweb-options,
#userweb-menu div.search-source-options {
  color: #8e8e8e;
  background-color: #f5f5f5;
}

#userweb-menu div.search-source-options {
  top: 30px;
}

#userweb-menu a.userweb-options:hover + div,
#userweb-menu div.userweb-options:hover {
  display: inline-block;
  right: 0;
  padding: 0;
  overflow: hidden;
}

#userweb-menu a.search-source-options:hover + div,
#userweb-menu div.search-source-options:hover {
  display: inline-block;
  left: 30px;
  padding: 0;
  overflow: hidden;
}

#userweb-menu div.userweb-options > a,
#userweb-menu div.search-source-options > a {
  display: block;
  padding: 4px 8px;
  text-decoration: none;
  color: #657178;
  outline: none;
}

#userweb-menu div.search-source-options > a {
  cursor: pointer;
  padding-left: 27px;
  background-size: 16px;
  background-repeat: no-repeat;
  background-position: 5px center;
}

#userweb-menu div.userweb-options > a:hover,
#userweb-menu div.search-source-options > a:hover {
  text-decoration: none;
  color: #8e8e8e;
  background-color: #fcfcfc;
}

#userweb-menu div.search-source-options > a.selected {
  background-color: #0072b2;
  color: #fff;
}

#userweb-menu a.userweb-options > img {
  vertical-align: top;
  margin-top: 4px;
  margin-right: 4px;
  border-radius: 3px;
}

#userweb-menu div.browse > div.nav-group {
  width: 200px;
  display: inline-block;
  vertical-align: top;
}

#userweb-menu div.browse > div.nav-group > h1 {
  font-family: "Segoe UI", Trebuchet MS, "Lucida Sans", Helvetica, Verdana,
    Arial, sans-serif;
  font-size: 20px;
  font-weight: bold;
  padding: 0;
  margin: 0 0 0 -1px;
  color: #555;
  line-height: 30px;
}

#userweb-menu div.browse ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

#userweb-menu div.browse li {
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}

#userweb-menu div.browse a {
  font-weight: normal;
  color: #555;
  font-size: 12px;
  line-height: 20px;
  margin: 0;
  padding: 0;
  text-decoration: none;
}

#userweb-menu div.browse a:hover {
  text-decoration: underline;
}

#userweb-menu div.browse ul ul {
  margin-left: 10px;
}

#userweb-menu div.browse span:focus {
  outline: none;
}

/* Hide everything except the UserWeb logo when the user isn't logged in */
#userweb-menu.userweb-anonymous > div.menu-container,
#userweb-menu.userweb-anonymous > .top-menu-bar > div.userweb-profile {
  display: none;
}

/* Responsive styles */
@media only screen and (max-width: 1075px) {
  #userweb-menu a.main-menu.userweb-options span {
    display: none;
  }
}

@media only screen and (max-width: 1000px) {
  #userweb-menu div.menu-container > a:nth-child(n + 7) {
    display: none;
  }

  #userweb-menu div.menu-container > a.browse {
    display: inline-block;
  }
}

@media only screen and (max-width: 900px) {
  #userweb-menu div.menu-container > a:nth-child(n + 6) {
    display: none;
  }

  #userweb-menu div.menu-container > a.browse {
    display: inline-block;
  }

  #userweb-menu.browsing div.browse {
    left: 20px !important;
  }
}

@media only screen and (max-width: 800px) {
  #userweb-menu div.menu-container > a:nth-child(n + 5) {
    display: none;
  }

  #userweb-menu div.menu-container > a.browse {
    display: inline-block;
  }

  #userweb-menu.browsing div.browse > div:last-child {
    display: block;
  }
}

@media only screen and (max-width: 700px) {
  #userweb-menu div.menu-container > a:nth-child(n + 3) {
    display: none;
  }

  #userweb-menu div.menu-container > a.browse {
    display: inline-block;
  }

  #userweb-menu.browsing div.browse > div {
    display: inline-block;
  }

  #userweb-menu.browsing div.browse > div:nth-child(-n + 2) {
    display: block;
  }

  #userweb-menu.browsing div.browse > div:first-child {
    float: left;
  }

  #userweb-menu.browsing div.browse > div:last-child {
    display: inline-block;
  }

  #userweb-menu div.browse li {
    overflow: visible;
  }
}

@media only screen and (max-width: 575px) {
  #userweb-menu div.menu-container > a:nth-child(-n + 7) {
    display: none;
  }

  #userweb-menu a.main-menu.userweb-options span {
    display: none;
  }

  #userweb-menu div.search-term-holder {
    display: none;
  }

  #userweb-menu.browsing div.browse > div:nth-child(-n + 4) {
    float: none;
    display: block;
  }

  #userweb-menu.browsing div.browse {
    left: 0 !important;
  }

  #userweb-menu div.browse li {
    overflow: hidden;
  }
}