/*------------------------------------------------------------------
MENU.LESS

Main menu of Roxit UI. Doesn't contain the menu in the pagetypes!
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
CONFIG.LESS

Contains variables for rules which are applied more than once.
Variables which are only needed in one file are kept in that file.
Almost every .less file imports this file and mixins.less

Uses a few lessCSS color funtions.
More info: http://lesscss.org/
-------------------------------------------------------------------*/
/*------------------------------------------------------------------
MIXINS.LESS

Contains frequently used rules and helpers for prefixing.
Mixins which are only needed in one file are kept in that file.
Almost every .less file imports this file and config.less

More info: http://lesscss.org/
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
CONFIG.LESS

Contains variables for rules which are applied more than once.
Variables which are only needed in one file are kept in that file.
Almost every .less file imports this file and mixins.less

Uses a few lessCSS color funtions.
More info: http://lesscss.org/
-------------------------------------------------------------------*/
.page-navbar-primary a,
.page-navbar-secondary a,
.page-navbar-primary span,
.page-navbar-secondary span {
  display: block;
}
.page-navbar-primary a,
.page-navbar-secondary a {
  cursor: pointer;
  text-decoration: none;
}
.page-navbar-primary a:focus,
.page-navbar-secondary a:focus {
  outline: 1px dotted white;
}
.page-navbar-primary span,
.page-navbar-secondary span {
  cursor: default;
}
.page-navbar-primary .dropdown.separator:before,
.page-navbar-secondary .dropdown.separator:before {
  margin-right: -10px;
}
.page-navbar-primary .flip .dropdown.separator:before,
.page-navbar-secondary .flip .dropdown.separator:before {
  margin-right: 0;
}
.page-navbar-primary > li,
.page-navbar-secondary > li {
  height: 40px;
  float: left;
  position: relative;
}
.page-navbar-primary > li.active,
.page-navbar-secondary > li.active,
.page-navbar-primary > li:hover,
.page-navbar-secondary > li:hover {
  background: #242424;
}
.page-navbar-primary > li > a,
.page-navbar-secondary > li > a,
.page-navbar-primary > li > span,
.page-navbar-secondary > li > span {
  height: 20px;
  padding: 10px 15px;
  color: white;
}
.page-navbar-primary > li > a > i,
.page-navbar-secondary > li > a > i,
.page-navbar-primary > li > span > i,
.page-navbar-secondary > li > span > i {
  color: white;
}
.page-navbar-primary > li.more-link > span,
.page-navbar-secondary > li.more-link > span {
  font-size: 1.5em;
  line-height: 5px;
}
.page-navbar-primary > li.dropdown > a,
.page-navbar-secondary > li.dropdown > a,
.page-navbar-primary > li.dropdown > span,
.page-navbar-secondary > li.dropdown > span {
  padding-right: 30px;
}
.page-navbar-primary > li.dropdown:after,
.page-navbar-secondary > li.dropdown:after {
  display: block;
  content: "";
  position: absolute;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid white;
  width: 0;
  height: 0;
  vertical-align: top;
  top: 18px;
  right: 15px;
}
.page-navbar-primary > li ul,
.page-navbar-secondary > li ul {
  display: none;
  position: absolute;
  top: 40px;
  background: white;
  padding: 4px;
  min-width: 125px;
  border: 1px solid #d8d8d8;
  z-index: 3000;
  margin: 0;
}
.page-navbar-primary > li ul > li,
.page-navbar-secondary > li ul > li {
  margin-bottom: 1px;
  position: relative;
}
.page-navbar-primary > li ul > li.dropdown,
.page-navbar-secondary > li ul > li.dropdown {
  padding-right: 10px;
}
.page-navbar-primary > li ul > li.dropdown > a:after,
.page-navbar-secondary > li ul > li.dropdown > a:after,
.page-navbar-primary > li ul > li.dropdown > span:after,
.page-navbar-secondary > li ul > li.dropdown > span:after {
  display: block;
  content: "";
  position: absolute;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 4px solid #333333;
  width: 0;
  height: 0;
  vertical-align: top;
  right: 2px;
  top: 9px;
}
.page-navbar-primary > li ul > li:hover,
.page-navbar-secondary > li ul > li:hover {
  background: #707070;
}
.page-navbar-primary > li ul > li:hover > a,
.page-navbar-secondary > li ul > li:hover > a,
.page-navbar-primary > li ul > li:hover > span,
.page-navbar-secondary > li ul > li:hover > span {
  color: white;
}
.page-navbar-primary > li ul > li:hover.dropdown > a:after,
.page-navbar-secondary > li ul > li:hover.dropdown > a:after,
.page-navbar-primary > li ul > li:hover.dropdown > span:after,
.page-navbar-secondary > li ul > li:hover.dropdown > span:after {
  border-left-color: white;
}
.page-navbar-primary > li ul > li > a,
.page-navbar-secondary > li ul > li > a,
.page-navbar-primary > li ul > li > span,
.page-navbar-secondary > li ul > li > span {
  color: #333333;
  padding: 3px 10px;
  white-space: nowrap;
  height: 20px;
  line-height: 20px;
}
.page-navbar-primary > li ul > li > a:focus,
.page-navbar-secondary > li ul > li > a:focus,
.page-navbar-primary > li ul > li > span:focus,
.page-navbar-secondary > li ul > li > span:focus {
  outline: 1px dotted black;
}
.page-navbar-primary > li ul > li.active > a,
.page-navbar-secondary > li ul > li.active > a,
.page-navbar-primary > li ul > li.active > span,
.page-navbar-secondary > li ul > li.active > span {
  font-family: 'Segoe UI Semibold', 'Segoe UI', 'Lucida Grande', Arial, Helvetica, sans-serif;
  font-weight: 700;
}
.page-navbar-primary > li ul > li > ul,
.page-navbar-secondary > li ul > li > ul {
  display: none;
  top: auto;
  left: 100%;
  margin-top: -28px;
  margin-left: 4px;
}
.page-navbar-primary > li ul > li > ul:after,
.page-navbar-secondary > li ul > li > ul:after {
  position: absolute;
  content: '';
  top: 0;
  left: -5px;
  bottom: 0;
  width: 4px;
}
.page-navbar-primary > li ul > li:hover > ul,
.page-navbar-secondary > li ul > li:hover > ul {
  display: block;
}
.page-navbar-primary > li ul.flip,
.page-navbar-secondary > li ul.flip {
  right: 0;
}
.page-navbar-primary > li ul.flip > li.dropdown,
.page-navbar-secondary > li ul.flip > li.dropdown {
  padding-right: 0;
}
.page-navbar-primary > li ul.flip > li.dropdown > a:after,
.page-navbar-secondary > li ul.flip > li.dropdown > a:after,
.page-navbar-primary > li ul.flip > li.dropdown > span:after,
.page-navbar-secondary > li ul.flip > li.dropdown > span:after {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-right: 4px solid #333333;
  border-left: none;
  left: 2px;
  top: 50%;
  margin-top: -4px;
}
.page-navbar-primary > li ul.flip > li:hover.dropdown > a:after,
.page-navbar-secondary > li ul.flip > li:hover.dropdown > a:after,
.page-navbar-primary > li ul.flip > li:hover.dropdown > span:after,
.page-navbar-secondary > li ul.flip > li:hover.dropdown > span:after {
  border-right-color: white;
}
.page-navbar-primary > li ul.flip > li:after,
.page-navbar-secondary > li ul.flip > li:after {
  right: auto;
  left: -4px;
}
.page-navbar-primary > li ul.flip > li > ul,
.page-navbar-secondary > li ul.flip > li > ul {
  left: auto;
  right: 100%;
  margin-left: 0;
  margin-right: 4px;
}
.page-navbar-primary > li ul.flip > li > ul:after,
.page-navbar-secondary > li ul.flip > li > ul:after {
  left: auto;
  right: -5px;
}
.page-navbar-primary > li > ul,
.page-navbar-secondary > li > ul {
  border-top: none;
}
.page-navbar-primary > li:hover > ul,
.page-navbar-secondary > li:hover > ul {
  display: block;
}
.page-navbar-primary > li.form,
.page-navbar-secondary > li.form {
  padding: 0 5px;
}
.page-navbar-primary > li.form:hover,
.page-navbar-secondary > li.form:hover {
  background: none;
}
.page-navbar-primary > li.form input,
.page-navbar-secondary > li.form input,
.page-navbar-primary > li.form button,
.page-navbar-secondary > li.form button {
  width: auto;
  height: 27px;
  margin-top: 6.5px;
  font-size: 1.0em;
  line-height: 18px;
  border: none;
}
.page-navbar-primary > li.form input:focus,
.page-navbar-secondary > li.form input:focus,
.page-navbar-primary > li.form button:focus,
.page-navbar-secondary > li.form button:focus {
  outline: none;
}
.page-navbar-primary > li ul li.form,
.page-navbar-secondary > li ul li.form {
  padding: 5px;
  min-width: 250px;
}
.page-navbar-primary > li ul li.form:before,
.page-navbar-secondary > li ul li.form:before {
  display: block;
  content: '';
  position: absolute;
  z-index: -1;
  top: -5px;
  right: -100px;
  bottom: -100px;
  left: -100px;
}
.page-navbar-primary > li ul li.form:hover,
.page-navbar-secondary > li ul li.form:hover {
  background: white;
}
.page-navbar-primary > li ul li.form .field,
.page-navbar-secondary > li ul li.form .field {
  padding-right: 0;
}
.page-navbar-primary .page-logo > a,
.page-navbar-secondary .page-logo > a {
  font-size: 30px;
  line-height: 20px;
  font-family: 'Segoe UI Semibold', 'Segoe UI', 'Lucida Grande', Arial, Helvetica, sans-serif;
  font-weight: 700;
}
@media (max-width: 1400px) {
  .page-navbar-secondary > li > a,
  .page-navbar-secondary > li > a:hover,
  .page-navbar-secondary > li > span,
  .page-navbar-secondary > li > span:hover {
    width: 14px;
    overflow: hidden;
    color: transparent;
    -webkit-text-shadow: none;
    text-shadow: none;
  }
}
