@charset "UTF-8";
/* (C) Copyright 2020 Hewlett-Packard Enterprise Company, L.P. */
/* (C) Copyright 2020 Hewlett-Packard Enterprise Company, L.P. */
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-moz-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-ms-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-o-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@-moz-keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@-ms-keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@-o-keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0.7;
    -webkit-transform: translateX(-10px); }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }

@-moz-keyframes fadeInLeft {
  0% {
    opacity: 0.7;
    -moz-transform: translateX(-10px); }

  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }

@-ms-keyframes fadeInLeft {
  0% {
    opacity: 0.7;
    -ms-transform: translateX(-10px); }

  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }

@-o-keyframes fadeInLeft {
  0% {
    opacity: 0.7;
    -o-transform: translateX(-10px); }

  100% {
    opacity: 1;
    -o-transform: translateX(0); } }

@keyframes fadeInLeft {
  0% {
    opacity: 0.7;
    transform: translateX(-10px); }

  100% {
    opacity: 1;
    transform: translateX(0); } }

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0.7;
    -webkit-transform: translateY(-10px); }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }

@-moz-keyframes fadeInDown {
  0% {
    opacity: 0.7;
    -moz-transform: translateY(-10px); }

  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }

@-ms-keyframes fadeInDown {
  0% {
    opacity: 0.7;
    -ms-transform: translateY(-10px); }

  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }

@-o-keyframes fadeInDown {
  0% {
    opacity: 0.7;
    -o-transform: translateY(-10px); }

  100% {
    opacity: 1;
    -o-transform: translateY(0); } }

@keyframes fadeInUp {
  0% {
    opacity: 0.7;
    transform: translateY(10px); }

  100% {
    opacity: 1;
    transform: translateY(0); } }

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0.7;
    -webkit-transform: translateY(5px); }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }

@-moz-keyframes fadeInUp {
  0% {
    opacity: 0.7;
    -moz-transform: translateY(5px); }

  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }

@-ms-keyframes fadeInUp {
  0% {
    opacity: 0.7;
    -ms-transform: translateY(5px); }

  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }

@-o-keyframes fadeInUp {
  0% {
    opacity: 0.7;
    -o-transform: translateY(5px); }

  100% {
    opacity: 1;
    -o-transform: translateY(0); } }

@keyframes fadeInUp {
  0% {
    opacity: 0.7;
    transform: translateY(5px); }

  100% {
    opacity: 1;
    transform: translateY(0); } }

/* Fonts */
@font-face {
  font-family: 'HPBold';
  src: url("../../fonts/HPSimplifiedW04-Bold.eot");
  src: url("../../fonts/HPSimplifiedW04-Bold.eot?#iefix") format("embedded-opentype"), url("../../fonts/HPSimplifiedW04-Bold.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'HPRegular';
  src: url("../../fonts/HPSimplifiedW04-Regular.eot");
  src: url("../../fonts/HPSimplifiedW04-Regular.eot?#iefix") format("embedded-opentype"), url("../../fonts/HPSimplifiedW04-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'HPLight';
  src: url("../../fonts/HPSimplifiedW04-Light.eot");
  src: url("../../fonts/HPSimplifiedW04-Light.eot?#iefix") format("embedded-opentype"), url("../../fonts/HPSimplifiedW04-Light.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

html, body, #hp-body {
  height: 100%;
  width: 100%; }
  @media print {
    html, body, #hp-body {
      position: static;
      top: auto;
      left: auto;
      right: auto;
      bottom: auto;
      height: auto;
      width: auto;
      overflow: visible; } }

/* base typography, colors, & utility classes */
body, #hp-body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  line-height: 15px;
  overflow: hidden;
  background-color: #d9d9d9;
  color: #666666; }
  @media print {
    body, #hp-body {
      font-size: 12px;
      line-height: 14px;
      overflow: visible;
      background-color: #fff;
      color: #000; } }
  html.no-js body, html.no-js #hp-body {
    background-color: #fff; }
  body > .hp-logo, #hp-body > .hp-logo {
    position: absolute;
    top: 55px;
    left: 50%;
    height: 50px;
    width: 50px;
    background-position: -260px -180px;
    margin-left: -25px; }
  body > .hp-spinner, #hp-body > .hp-spinner {
    position: absolute;
    top: 120px; }
    body > .hp-spinner .hp-spinner-image, #hp-body > .hp-spinner .hp-spinner-image {
      background-position: -320px -40px; }
  body.hp-basic-layout #hp-body-div, #hp-body.hp-basic-layout #hp-body-div {
    max-width: 960px;
    margin: 0px auto; }

#hp-body-div {
  position: relative;
  height: 100%;
  width: 100%;
  background-color: #d9d9d9;
  color: #666666;
  overflow: hidden;
  -webkit-animation-name: reset, fade-in;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: ease-in;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-delay: 0, 0.1s;
  -moz-animation-name: reset, fade-in;
  -moz-animation-duration: 1s;
  -moz-animation-timing-function: ease-in;
  -moz-animation-iteration-count: 1;
  -moz-animation-delay: 0, 0.1s;
  -ms-animation-name: reset, fade-in;
  -ms-animation-duration: 1s;
  -ms-animation-timing-function: ease-in;
  -ms-animation-iteration-count: 1;
  -ms-animation-delay: 0, 0.1s;
  -o-animation-name: reset, fade-in;
  -o-animation-duration: 1s;
  -o-animation-timing-function: ease-in;
  -o-animation-iteration-count: 1;
  -o-animation-delay: 0, 0.1s; }
  #hp-body-div.hp-sessioned {
    background-color: #d9d9d9;
    color: #425563; }
    html.hp-high-contrast #hp-body-div.hp-sessioned {
      color: black; }
  #hp-body-div > .hp-confidential {
    position: absolute;
    bottom: 0px;
    right: 0px;
    font-size: 10px;
    line-height: normal;
    padding: 1px 5px;
    background-color: #d9d9d9;
    color: #666;
    z-index: 500; }
  @media print {
    #hp-body-div {
      position: static;
      top: auto;
      left: auto;
      right: auto;
      bottom: auto;
      height: auto;
      width: auto;
      overflow: visible;
      background-color: #fff;
      color: #000; } }

/* http://css3.wikidot.com/blog:animated-page-entry-with-css3 */
@-webkit-keyframes reset {
  0% {
    opacity: 0; }

  100% {
    opacity: 0; } }

@-webkit-keyframes fade-in {
  0% {
    opacity: 0; }

  60% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-moz-keyframes reset {
  0% {
    opacity: 0; }

  100% {
    opacity: 0; } }

@-moz-keyframes fade-in {
  0% {
    opacity: 0; }

  60% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-ms-keyframes reset {
  0% {
    opacity: 0; }

  100% {
    opacity: 0; } }

@-ms-keyframes fade-in {
  0% {
    opacity: 0; }

  60% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-o-keyframes reset {
  0% {
    opacity: 0; }

  100% {
    opacity: 0; } }

@-o-keyframes fade-in {
  0% {
    opacity: 0; }

  60% {
    opacity: 0; }

  100% {
    opacity: 1; } }

html:not(.experimental) .hp-experimental {
  display: none !important; }

.experimental .hp-master-details .hp-details-pane .hp-details-header
.hp-details-title-controls .hp-map-control {
  display: inline-block; }

.hp-logo {
  background-image: url("../../img/hp-piano/hp-piano-icons.png");
  background-position: -260px -140px;
  background-repeat: no-repeat;
  width: 32px;
  height: 30px; }

input,
textarea,
select,
button {
  font-family: Arial, Helvetica, sans-serif;
  /* because Webkit hijacks this */ }

a {
  color: #007dba;
  text-decoration: none;
  cursor: pointer; }
  a:hover {
    text-decoration: underline; }
  a.hp-disabled {
    color: inherit;
    pointer-events: none;
    cursor: default; }
    a.hp-disabled:hover {
      text-decoration: none; }

h1 {
  font-size: 20px;
  font-weight: bold;
  line-height: 30px; }

h2 {
  font-size: 18px;
  font-weight: normal;
  margin: 20px 0px 10px 0px; }

h3 {
  font-size: 16px;
  font-weight: normal;
  margin: 10px 0px; }

label.hp-error, div.hp-error, p.hp-error, span.hp-error, td.hp-error, h1.hp-error, h2.hp-error, h3.hp-error {
  color: #ff8d6d; }
label.hp-unset, label.hp-pending, label.hp-missing, div.hp-unset, div.hp-pending, div.hp-missing, p.hp-unset, p.hp-pending, p.hp-missing, span.hp-unset, span.hp-pending, span.hp-missing, td.hp-unset, td.hp-pending, td.hp-missing, h1.hp-unset, h1.hp-pending, h1.hp-missing, h2.hp-unset, h2.hp-pending, h2.hp-missing, h3.hp-unset, h3.hp-pending, h3.hp-missing {
  color: #737373;
  font-style: italic; }
  html.hp-high-contrast label.hp-unset, html.hp-high-contrast label.hp-pending, html.hp-high-contrast label.hp-missing, html.hp-high-contrast div.hp-unset, html.hp-high-contrast div.hp-pending, html.hp-high-contrast div.hp-missing, html.hp-high-contrast p.hp-unset, html.hp-high-contrast p.hp-pending, html.hp-high-contrast p.hp-missing, html.hp-high-contrast span.hp-unset, html.hp-high-contrast span.hp-pending, html.hp-high-contrast span.hp-missing, html.hp-high-contrast td.hp-unset, html.hp-high-contrast td.hp-pending, html.hp-high-contrast td.hp-missing, html.hp-high-contrast h1.hp-unset, html.hp-high-contrast h1.hp-pending, html.hp-high-contrast h1.hp-missing, html.hp-high-contrast h2.hp-unset, html.hp-high-contrast h2.hp-pending, html.hp-high-contrast h2.hp-missing, html.hp-high-contrast h3.hp-unset, html.hp-high-contrast h3.hp-pending, html.hp-high-contrast h3.hp-missing {
    color: #425563; }
label.hp-help, label.hp-optional, label.hp-important, div.hp-help, div.hp-optional, div.hp-important, p.hp-help, p.hp-optional, p.hp-important, span.hp-help, span.hp-optional, span.hp-important, td.hp-help, td.hp-optional, td.hp-important, h1.hp-help, h1.hp-optional, h1.hp-important, h2.hp-help, h2.hp-optional, h2.hp-important, h3.hp-help, h3.hp-optional, h3.hp-important {
  color: #737373; }
  html.hp-high-contrast label.hp-help, html.hp-high-contrast label.hp-optional, html.hp-high-contrast label.hp-important, html.hp-high-contrast div.hp-help, html.hp-high-contrast div.hp-optional, html.hp-high-contrast div.hp-important, html.hp-high-contrast p.hp-help, html.hp-high-contrast p.hp-optional, html.hp-high-contrast p.hp-important, html.hp-high-contrast span.hp-help, html.hp-high-contrast span.hp-optional, html.hp-high-contrast span.hp-important, html.hp-high-contrast td.hp-help, html.hp-high-contrast td.hp-optional, html.hp-high-contrast td.hp-important, html.hp-high-contrast h1.hp-help, html.hp-high-contrast h1.hp-optional, html.hp-high-contrast h1.hp-important, html.hp-high-contrast h2.hp-help, html.hp-high-contrast h2.hp-optional, html.hp-high-contrast h2.hp-important, html.hp-high-contrast h3.hp-help, html.hp-high-contrast h3.hp-optional, html.hp-high-contrast h3.hp-important {
    color: #425563; }
label.hp-primary, div.hp-primary, p.hp-primary, span.hp-primary, td.hp-primary, h1.hp-primary, h2.hp-primary, h3.hp-primary {
  color: #000;
  font-weight: bold; }
label.hp-secondary, div.hp-secondary, p.hp-secondary, span.hp-secondary, td.hp-secondary, h1.hp-secondary, h2.hp-secondary, h3.hp-secondary {
  color: #737373; }
  html.hp-high-contrast label.hp-secondary, html.hp-high-contrast div.hp-secondary, html.hp-high-contrast p.hp-secondary, html.hp-high-contrast span.hp-secondary, html.hp-high-contrast td.hp-secondary, html.hp-high-contrast h1.hp-secondary, html.hp-high-contrast h2.hp-secondary, html.hp-high-contrast h3.hp-secondary {
    color: #425563; }
label.hp-numeric, div.hp-numeric, p.hp-numeric, span.hp-numeric, td.hp-numeric, h1.hp-numeric, h2.hp-numeric, h3.hp-numeric {
  text-align: right; }
label.hp-dynamic, div.hp-dynamic, p.hp-dynamic, span.hp-dynamic, td.hp-dynamic, h1.hp-dynamic, h2.hp-dynamic, h3.hp-dynamic {
  opacity: 1.0;
  -webkit-transition: opacity 0.2s ease 0s;
  -moz-transition: opacity 0.2s ease 0s;
  transition: opacity 0.2s ease 0s;
  -webkit-backface-visibility: hidden; }
  .hp-show-changing label.hp-dynamic, .hp-show-changing div.hp-dynamic, .hp-show-changing p.hp-dynamic, .hp-show-changing span.hp-dynamic, .hp-show-changing td.hp-dynamic, .hp-show-changing h1.hp-dynamic, .hp-show-changing h2.hp-dynamic, .hp-show-changing h3.hp-dynamic {
    opacity: 0.2; }
label.hp-unavailable, div.hp-unavailable, p.hp-unavailable, span.hp-unavailable, td.hp-unavailable, h1.hp-unavailable, h2.hp-unavailable, h3.hp-unavailable {
  position: relative;
  min-width: 1em; }
  label.hp-unavailable:before, div.hp-unavailable:before, p.hp-unavailable:before, span.hp-unavailable:before, td.hp-unavailable:before, h1.hp-unavailable:before, h2.hp-unavailable:before, h3.hp-unavailable:before {
    position: absolute;
    content: '—'; }

label.hp-secondary, span.hp-secondary {
  margin-left: 5px; }

input, textarea {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  margin-bottom: 10px;
  padding: 7px 18px 7px 10px;
  background-color: white;
  border: 1px solid #d9d9d9;
  font-size: 13px;
  line-height: 14px;
  color: #425563;
  outline: none;
  /*&.hp-normal, &.valid {
    border-color: $normal;
    background-image: $valid-url;
    background-position: right 0px;
    background-repeat: no-repeat;
  }*/ }
  html.hp-high-contrast input, html.hp-high-contrast textarea {
    color: black; }
  input.hp-error, input.error, textarea.hp-error, textarea.error {
    border-color: #ff8d6d;
    background-image: url(data:image/gif;base64,R0lGODlhFAAUAMIEAP+Zmf9mM8yZmcwzM////////////////yH5BAEKAAMALAAAAAAUABQAAAMgOLrc/jDKSScAtd3MNlfeF3JjVlbn9wmYmlqtKs90lQAAOw==);
    background-position: right 4px;
    background-repeat: no-repeat;
    padding-right: 18px; }
  input:focus, textarea:focus {
    border-color: #E4FFEE; }

textarea {
  background: #fff; }
  textarea.hp-code {
    font-family: monospace; }

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #cccccc; }
input:-moz-placeholder, textarea:-moz-placeholder {
  color: #cccccc; }

input[type="text"], input[type="date"] {
  height: 30px; }

input[type="radio"], input[type="checkbox"] {
  border: none;
  padding: 0px; }

input[type="number"] {
  text-align: right; }

input[type="search"] {
  font-size: 16px; }

input[type="button"], input[type="submit"], input[type="reset"],
button, select, a.hp-button, label.hp-button, a.ui-button {
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0px;
  padding: 0px  13px;
  font-size: 18px;
  line-height: 26px;
  font-weight: normal;
  height: 30px;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: #fff;
  border: 2px solid #e6e6e6;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  color: #000;
  font-family: 'HPRegular', Arial, Helvetica, sans-serif;
  cursor: pointer;
  -webkit-transition: background-color 0.1s;
  -moz-transition: background-color 0.1s;
  transition: background-color 0.1s; }
  input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover,
  button:hover, select:hover, a.hp-button:hover, label.hp-button:hover, a.ui-button:hover {
    border-color: #999;
    text-decoration: none; }
  input[type="button"]:active, input[type="submit"]:active, input[type="reset"]:active,
  button:active, select:active, a.hp-button:active, label.hp-button:active, a.ui-button:active {
    background-color: #e6e6e6;
    border-color: #999; }
  input[type="button"].hp-disabled, input[type="submit"].hp-disabled, input[type="reset"].hp-disabled,
  button.hp-disabled, select.hp-disabled, a.hp-button.hp-disabled, label.hp-button.hp-disabled, a.ui-button.hp-disabled {
    background-color: #f3f3f3;
    border-color: #f3f3f3;
    color: #737373;
    cursor: default; }
  input[type="button"]:disabled, input[type="submit"]:disabled, input[type="reset"]:disabled,
  button:disabled, select:disabled, a.hp-button:disabled, label.hp-button:disabled, a.ui-button:disabled {
    background-color: #f3f3f3;
    border-color: #f3f3f3;
    color: #737373; }
  input[type="button"].hp-primary, input[type="button"].ui-datepicker-close, input[type="submit"].hp-primary, input[type="submit"].ui-datepicker-close, input[type="reset"].hp-primary, input[type="reset"].ui-datepicker-close,
  button.hp-primary,
  button.ui-datepicker-close, select.hp-primary, select.ui-datepicker-close, a.hp-button.hp-primary, a.hp-button.ui-datepicker-close, label.hp-button.hp-primary, label.hp-button.ui-datepicker-close, a.ui-button.hp-primary, a.ui-button.ui-datepicker-close {
    background-color: #00B388;
    border-color: #00B388;
    color: #fff;
    font-family: 'HPBold', Arial, Helvetica, sans-serif; }
    input[type="button"].hp-primary:hover, input[type="button"].ui-datepicker-close:hover, input[type="submit"].hp-primary:hover, input[type="submit"].ui-datepicker-close:hover, input[type="reset"].hp-primary:hover, input[type="reset"].ui-datepicker-close:hover,
    button.hp-primary:hover,
    button.ui-datepicker-close:hover, select.hp-primary:hover, select.ui-datepicker-close:hover, a.hp-button.hp-primary:hover, a.hp-button.ui-datepicker-close:hover, label.hp-button.hp-primary:hover, label.hp-button.ui-datepicker-close:hover, a.ui-button.hp-primary:hover, a.ui-button.ui-datepicker-close:hover {
      border-color: #666; }
    input[type="button"].hp-primary:active, input[type="button"].ui-datepicker-close:active, input[type="submit"].hp-primary:active, input[type="submit"].ui-datepicker-close:active, input[type="reset"].hp-primary:active, input[type="reset"].ui-datepicker-close:active,
    button.hp-primary:active,
    button.ui-datepicker-close:active, select.hp-primary:active, select.ui-datepicker-close:active, a.hp-button.hp-primary:active, a.hp-button.ui-datepicker-close:active, label.hp-button.hp-primary:active, label.hp-button.ui-datepicker-close:active, a.ui-button.hp-primary:active, a.ui-button.ui-datepicker-close:active {
      background-color: #00B388;
      border-color: #333; }
    input[type="button"].hp-primary.hp-disabled, input[type="button"].ui-datepicker-close.hp-disabled, input[type="submit"].hp-primary.hp-disabled, input[type="submit"].ui-datepicker-close.hp-disabled, input[type="reset"].hp-primary.hp-disabled, input[type="reset"].ui-datepicker-close.hp-disabled,
    button.hp-primary.hp-disabled,
    button.ui-datepicker-close.hp-disabled, select.hp-primary.hp-disabled, select.ui-datepicker-close.hp-disabled, a.hp-button.hp-primary.hp-disabled, a.hp-button.ui-datepicker-close.hp-disabled, label.hp-button.hp-primary.hp-disabled, label.hp-button.ui-datepicker-close.hp-disabled, a.ui-button.hp-primary.hp-disabled, a.ui-button.ui-datepicker-close.hp-disabled {
      background-color: #f3f3f3;
      border-color: #f3f3f3;
      color: #737373; }
    input[type="button"].hp-primary:disabled, input[type="button"].ui-datepicker-close:disabled, input[type="submit"].hp-primary:disabled, input[type="submit"].ui-datepicker-close:disabled, input[type="reset"].hp-primary:disabled, input[type="reset"].ui-datepicker-close:disabled,
    button.hp-primary:disabled,
    button.ui-datepicker-close:disabled, select.hp-primary:disabled, select.ui-datepicker-close:disabled, a.hp-button.hp-primary:disabled, a.hp-button.ui-datepicker-close:disabled, label.hp-button.hp-primary:disabled, label.hp-button.ui-datepicker-close:disabled, a.ui-button.hp-primary:disabled, a.ui-button.ui-datepicker-close:disabled {
      background-color: #f3f3f3;
      border-color: #f3f3f3;
      color: #737373; }
  input[type="button"].hp-secondary, input[type="submit"].hp-secondary, input[type="reset"].hp-secondary,
  button.hp-secondary, select.hp-secondary, a.hp-button.hp-secondary, label.hp-button.hp-secondary, a.ui-button.hp-secondary {
    color: #007dba;
    border: 2px solid #E4FFEB;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    background-color: #E4FFEB; }
    input[type="button"].hp-secondary:hover, input[type="submit"].hp-secondary:hover, input[type="reset"].hp-secondary:hover,
    button.hp-secondary:hover, select.hp-secondary:hover, a.hp-button.hp-secondary:hover, label.hp-button.hp-secondary:hover, a.ui-button.hp-secondary:hover {
      border-color: #666; }
    input[type="button"].hp-secondary:active, input[type="submit"].hp-secondary:active, input[type="reset"].hp-secondary:active,
    button.hp-secondary:active, select.hp-secondary:active, a.hp-button.hp-secondary:active, label.hp-button.hp-secondary:active, a.ui-button.hp-secondary:active {
      background-color: #e6e6e6;
      border-color: #333; }
    input[type="button"].hp-secondary.hp-disabled, input[type="submit"].hp-secondary.hp-disabled, input[type="reset"].hp-secondary.hp-disabled,
    button.hp-secondary.hp-disabled, select.hp-secondary.hp-disabled, a.hp-button.hp-secondary.hp-disabled, label.hp-button.hp-secondary.hp-disabled, a.ui-button.hp-secondary.hp-disabled {
      background-color: #f3f3f3;
      border-color: #f3f3f3;
      color: #737373; }
    input[type="button"].hp-secondary:disabled, input[type="submit"].hp-secondary:disabled, input[type="reset"].hp-secondary:disabled,
    button.hp-secondary:disabled, select.hp-secondary:disabled, a.hp-button.hp-secondary:disabled, label.hp-button.hp-secondary:disabled, a.ui-button.hp-secondary:disabled {
      background-color: #f3f3f3;
      border-color: #f3f3f3;
      color: #737373; }
  input[type="button"]:focus, input[type="submit"]:focus, input[type="reset"]:focus,
  button:focus, select:focus, a.hp-button:focus, label.hp-button:focus, a.ui-button:focus {
    border-color: #E4FFEE; }

input::-moz-focus-inner,
button::-moz-focus-inner {
  padding: 0;
  border: 0; }

input[disabled] {
  color: #999;
  background: #fcfcfc;
  border-color: #e2e2e2; }

.ui-buttonset {
  margin-left: 0px; }
  .ui-buttonset label.ui-button {
    margin: 2px 20px 0px 5px;
    border-radius: 0px; }
    .ui-buttonset label.ui-button.ui-state-active {
      color: #222; }
    .ui-buttonset label.ui-button.ui-corner-right {
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px; }
    .ui-buttonset label.ui-button.ui-corner-left {
      border-top-left-radius: 5px;
      border-bottom-left-radius: 5px; }

select {
  padding-right: 23px;
  background: url("../../img/hp-piano/down-arrow-select.png") no-repeat right center, -webkit-gradient(linear, left top, left bottom, from(white), to(#eeeeee)); }

option {
  padding: 7px 10px;
  border-top: 1px solid #d9d9d9;
  -webkit-appearance: none; }
  option:hover {
    cursor: pointer; }

.hp-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

.hp-text-tip {
  position: absolute;
  background-color: white;
  color: #425563;
  padding: 5px;
  margin-left: -6px;
  margin-top: -6px;
  border: 1px solid #bfbfbf;
  -webkit-box-shadow: 3px 3px 5px 0px #999999;
  -moz-box-shadow: 3px 3px 5px 0px #999999;
  box-shadow: 3px 3px 5px 0px #999999;
  z-index: 3000; }
  .hp-text-tip.hp-global {
    background-color: white;
    color: #666666;
    border: 1px solid #888;
    -webkit-box-shadow: 1px 1px 4px 2px #444444;
    -moz-box-shadow: 1px 1px 4px 2px #444444;
    box-shadow: 1px 1px 4px 2px #444444; }

.hp-template {
  display: none; }

.hp-collapsible > label {
  display: block;
  font-size: 16px;
  color: #737373;
  margin-top: 10px;
  margin-bottom: 10px;
  padding-left: 20px;
  background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAAJmZmaWlpdnZ2b+/v/Ly8rKysuXl5czMzP///wAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAgALAAAAAAUABQAAAQuEMlJq7046827/1UAjCQQbEJJClyhFp2hGt5ADh9BEuABHCAEIcALGo/IpHITAQA7);
  background-position: -1px;
  background-repeat: no-repeat;
  cursor: pointer; }
  html.hp-high-contrast .hp-collapsible > label {
    color: #425563; }
  .hp-collapsible > label:hover {
    background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAADMzM39/f8zMzExMTLKyspmZmWZmZuXl5f///wAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAgALAAAAAAUABQAAAQuEMlJq7046827/9UAjCQwbERJEpyhGp2gCl5ABt9BHmABFCDEYcALGo/IpHITAQA7);
    color: #425563; }
.hp-collapsible.hp-collapsed > label {
  background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAAJmZmaWlpdnZ2bm5ufLy8szMzLKysuXl5b+/v////wAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAkALAAAAAAUABQAAAQrMMlJq7046827T4HwTQBgHGNZIoSnqkW7vWrA0UB8q4O8n6PQaEgsGo/HCAA7); }
  .hp-collapsible.hp-collapsed > label:hover {
    background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAADMzM3JycszMzExMTLKyspmZmWZmZuXl5X9/f////wAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAkALAAAAAAUABQAAAQrMMlJq7046827TwPxTQBgCGNZIoenqkW7verA0UB8q4G8n6PQaEgsGo/HCAA7); }
.hp-collapsible.hp-collapsed > div, .hp-collapsible.hp-collapsed > ol, .hp-collapsible.hp-collapsed > table {
  height: 0px;
  overflow: hidden; }

.hp-collapser {
  width: 18px;
  height: 18px;
  background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAAJmZmaWlpdnZ2bm5ufLy8szMzLKysuXl5b+/v////wAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAkALAAAAAAUABQAAAQrMMlJq7046827T4HwTQBgHGNZIoSnqkW7vWrA0UB8q4O8n6PQaEgsGo/HCAA7);
  background-position: -1px;
  background-repeat: no-repeat;
  cursor: pointer; }
  .hp-collapser:hover {
    background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAADMzM3JycszMzExMTLKyspmZmWZmZuXl5X9/f////wAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAkALAAAAAAUABQAAAQrMMlJq7046827TwPxTQBgCGNZIoenqkW7verA0UB8q4G8n6PQaEgsGo/HCAA7); }
  .hp-collapser.hp-active {
    background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAAJmZmaWlpdnZ2b+/v/Ly8rKysuXl5czMzP///wAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAgALAAAAAAUABQAAAQuEMlJq7046827/1UAjCQQbEJJClyhFp2hGt5ADh9BEuABHCAEIcALGo/IpHITAQA7); }
    .hp-collapser.hp-active:hover {
      background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAADMzM39/f8zMzExMTLKyspmZmWZmZuXl5f///wAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAgALAAAAAAUABQAAAQuEMlJq7046827/9UAjCQwbERJEpyhGp2gCl5ABt9BHmABFCDEYcALGo/IpHITAQA7); }

.hp-dropper {
  width: 12px;
  height: 6px;
  background-image: url("../../img/hp-piano/down-arrow.png");
  background-repeat: no-repeat;
  background-position: center; }
  .hp-dropper:hover {
    background-image: url("../../img/hp-piano/down-arrow-hover.png"); }

.hp-selected .hp-dropper {
  background-image: url("../../img/hp-piano/collapse-open-select.png"); }
.hp-selected .hp-simple-select:hover .hp-dropper {
  background-image: url("../../img/hp-piano/collapse-open-select-over.png"); }

.hp-comments-summary {
  position: relative;
  width: 19px;
  height: 15px;
  margin-top: 3px;
  background-image: url("../../img/hp-piano/comment.png");
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer; }
  .hp-comments-summary.hp-empty {
    opacity: 0.4; }
  .hp-comments-summary span {
    display: block;
    position: absolute;
    right: 0px;
    top: 4px;
    border-radius: 10px;
    background-color: rgba(128, 128, 128, 0.9);
    border: 1px solid #999;
    color: #fff;
    font-size: 8px;
    line-height: 8px;
    padding: 1px 3px; }

.hp-selected .hp-comments-summary {
  background-image: url("../../img/hp-piano/comment-select.png"); }
  .hp-selected .hp-comments-summary span {
    color: #333;
    background-color: rgba(255, 255, 255, 0.9);
    border: 1px solid #eee; }
  .hp-selected .hp-comments-summary:hover {
    background-image: url("../../img/hp-piano/comment-select-over.png");
    border-bottom: 1px solid #fff; }
    .hp-selected .hp-comments-summary:hover span {
      background-color: #fff; }

.hp-timestamp {
  color: #737373;
  white-space: nowrap; }
  html.hp-high-contrast .hp-timestamp {
    color: #425563; }

.hp-select, .hp-drop-menu {
  position: relative;
  white-space: nowrap; }
  .hp-select:focus, .hp-drop-menu:focus {
    outline: none; }
  .hp-select .hp-options, .hp-drop-menu .hp-options {
    display: none;
    min-width: 100%;
    overflow: hidden;
    margin-bottom: 0px;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    -ms-box-sizing: content-box;
    box-sizing: content-box; }
    .hp-select .hp-options ol, .hp-drop-menu .hp-options ol {
      min-width: 100%;
      overflow: hidden;
      margin-bottom: 0px; }
    .hp-select .hp-options li, .hp-drop-menu .hp-options li {
      display: block;
      color: #425563;
      height: 30px;
      line-height: 30px;
      padding-left: 10px;
      padding-right: 10px;
      white-space: nowrap;
      cursor: pointer; }
      html.hp-high-contrast .hp-select .hp-options li, html.hp-high-contrast .hp-drop-menu .hp-options li {
        color: black; }
      .hp-select .hp-options li:hover, .hp-select .hp-options li.hp-active, .hp-drop-menu .hp-options li:hover, .hp-drop-menu .hp-options li.hp-active {
        background-color: #e6e6e6;
        text-decoration: none; }
      .hp-select .hp-options li.hp-selected, .hp-drop-menu .hp-options li.hp-selected {
        background-color: #E4FFEE;
        font-weight: bold; }
      .hp-select .hp-options li.hp-sub-options, .hp-drop-menu .hp-options li.hp-sub-options {
        height: auto;
        padding: 0px; }
        .hp-select .hp-options li.hp-sub-options:hover, .hp-drop-menu .hp-options li.hp-sub-options:hover {
          background: none; }
        .hp-select .hp-options li.hp-sub-options .hp-prefix, .hp-drop-menu .hp-options li.hp-sub-options .hp-prefix {
          visibility: hidden;
          padding-right: 5px;
          font-weight: normal; }
        .hp-select .hp-options li.hp-sub-options ol li:first-child .hp-prefix, .hp-drop-menu .hp-options li.hp-sub-options ol li:first-child .hp-prefix {
          visibility: visible; }
        .hp-select .hp-options li.hp-sub-options ol li:hover .hp-prefix, .hp-drop-menu .hp-options li.hp-sub-options ol li:hover .hp-prefix {
          visibility: visible;
          color: #737373; }
      .hp-select .hp-options li a, .hp-drop-menu .hp-options li a {
        display: block;
        width: 100%;
        height: 100%;
        text-decoration: none; }
      .hp-select .hp-options li .hp-status, .hp-drop-menu .hp-options li .hp-status {
        float: left;
        margin-top: 10px; }
    .hp-select .hp-options > a, .hp-drop-menu .hp-options > a {
      display: block;
      color: #425563;
      height: 30px;
      padding-left: 10px;
      padding-right: 10px;
      border-top: 1px solid #d9d9d9;
      white-space: nowrap;
      cursor: pointer; }
      html.hp-high-contrast .hp-select .hp-options > a, html.hp-high-contrast .hp-drop-menu .hp-options > a {
        color: black; }
  .hp-select.hp-active .hp-options, .hp-drop-menu.hp-active .hp-options {
    display: block;
    position: absolute;
    top: -1px;
    padding-top: 30px;
    background-color: white;
    border-bottom: 5px solid #00B388;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
    z-index: 200; }
  .hp-select.hp-select-multi li.hp-selected:hover, .hp-drop-menu.hp-select-multi li.hp-selected:hover {
    background-color: #e6e6e6; }
  .hp-select.hp-pinned, .hp-drop-menu.hp-pinned {
    background: transparent;
    border: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    margin: 10px 0px 20px 10px; }
    .hp-select.hp-pinned > label, .hp-drop-menu.hp-pinned > label {
      position: relative;
      display: block;
      color: #737373;
      margin: 5px 0px;
      padding: 0px; }
      html.hp-high-contrast .hp-select.hp-pinned > label, html.hp-high-contrast .hp-drop-menu.hp-pinned > label {
        color: #425563; }
      .hp-select.hp-pinned > label:after, .hp-drop-menu.hp-pinned > label:after {
        content: ':'; }
    .hp-select.hp-pinned .hp-options, .hp-drop-menu.hp-pinned .hp-options {
      position: relative;
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      -ms-box-shadow: none;
      -o-box-shadow: none;
      box-shadow: none;
      border: none;
      background-color: transparent;
      padding-top: 0px; }
  .hp-select ol, .hp-drop-menu ol {
    border-bottom: 1px solid #d9d9d9; }
    .hp-select ol:last-of-type, .hp-drop-menu ol:last-of-type {
      border: none;
      margin-bottom: 0px;
      padding-bottom: 0px; }

.hp-select > label {
  position: relative;
  display: none;
  padding: 0px 10px; }
.hp-select .hp-value {
  position: relative;
  display: block;
  padding-left: 10px;
  border: 1px solid transparent;
  cursor: pointer; }
  .hp-select .hp-value:after {
    display: inline-block;
    content: '';
    width: 20px;
    height: 12px;
    background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAALi4usLCw9LS1OTk5czMzLy8vtfX2Onp6cXFx////wAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAkALAAAAAAUABQAAAQyMMlJq7046827/2BWIMd0IMVWAGRyAql2AICQCHS5DXRADx4DDWAAEQCEkHLJbDqfmQgAOw==);
    background-position: right -2px;
    background-repeat: no-repeat; }
    @media print {
      .hp-select .hp-value:after {
        display: none; } }
  .hp-select .hp-value:hover:after {
    content: '';
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wwdAQoR2aLEVgAAAI1JREFUOMvt0z0KwkAQBeCPiJV2Bjs9jiDprOz3ADmjECy9jwSMzQQWif8gFnkwxbx585id3WXEzzC5yadY4oL2Ts8MC5xDN4g9OhxQDtRLNKHZPZpwG6IORxRZrQiui0k2z45bZ2YN5hFNxtev7q7Kmk4RfV69exEpFt4btMF9hJQZpW+fyBqr8af8Ea427SL95COjowAAAABJRU5ErkJggg==); }
    .hp-global .hp-select .hp-value:hover:after {
      background-image: url(data:image/gif;base64,R0lGODlhFAAUAIAAAP///////yH5BAEHAAEALAAAAAAUABQAAAIajI+py+0Po5zUgYtBzFhy2oFXRZbmiaZqUgAAOw==); }
  .hp-global .hp-select .hp-value:hover {
    color: #666666; }
  .hp-master-filter .hp-select .hp-value {
    display: none; }
.hp-select:focus .hp-value {
  border: 1px solid #E4FFEE; }
.hp-select.hp-sort .hp-value:after {
  content: '';
  background-image: url(data:image/gif;base64,R0lGODlhFAAUAKIAAO7u7t3d3czMzLu7u7Ozs6KiopmZmf///yH5BAEHAAcALAAAAAAUABQAAAMpeLrc/jDKSau9kWAVTNiEoV2AYQLXYBqDVa4GSgmwIVRFXWx87/9ASQIAOw==);
  background-position: right -2px; }
.hp-select.hp-sort .hp-value:hover:after {
  content: '';
  background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAAObm5t3d3bOzs5mZmYCAgGZmZjw8PDMzM////wAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAgALAAAAAAUABQAAAQsEMlJq7046827/1kBSsIhjMUhfsHhBh/hHoQHzC7QDfgxdIaeYUQsGo9ITQQAOw==); }
.hp-select.hp-sort.hp-sort-desc .hp-value:after {
  content: '';
  background-image: url(data:image/gif;base64,R0lGODlhFAAUAKIAAO7u7t3d3czMzLu7u7Ozs6KiopmZmf///yH5BAEHAAcALAAAAAAUABQAAAMqeLrc/jDKSau9rpi9SxXcJlRAaADWwA1XuaEXYRDYERhBfdB67//AoCMBADs=);
  background-position: right -2px; }
.hp-select.hp-sort.hp-sort-desc .hp-value:hover:after {
  content: '';
  background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAAObm5t3d3bOzs5mZmYCAgGZmZjw8PDMzM////wAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAgALAAAAAAUABQAAAQtEMlJq7046827/5ZxjKPRDeQ4dEB6AB5BEl9ABmBxFCAiHIIegicsGo/IpCUCADs=); }
.hp-select.hp-active > label {
  position: absolute;
  left: 1px;
  display: block;
  color: #737373;
  background-color: white;
  z-index: 201;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }
  html.hp-high-contrast .hp-select.hp-active > label {
    color: #425563; }
.hp-select.hp-active .hp-value {
  overflow: hidden; }
.hp-select.hp-pinned label {
  position: relative; }

.hp-drop-menu > label {
  position: relative;
  display: block;
  padding-left: 10px;
  border: 1px solid transparent;
  cursor: pointer; }
  .hp-drop-menu > label:after {
    display: inline-block;
    content: '';
    width: 20px;
    height: 12px;
    background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAALi4usLCw9LS1OTk5czMzLy8vtfX2Onp6cXFx////wAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAkALAAAAAAUABQAAAQyMMlJq7046827/2BWIMd0IMVWAGRyAql2AICQCHS5DXRADx4DDWAAEQCEkHLJbDqfmQgAOw==);
    background-position: right -1px;
    background-repeat: no-repeat; }
  .hp-drop-menu > label:hover:after {
    content: '';
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wwdAQoR2aLEVgAAAI1JREFUOMvt0z0KwkAQBeCPiJV2Bjs9jiDprOz3ADmjECy9jwSMzQQWif8gFnkwxbx585id3WXEzzC5yadY4oL2Ts8MC5xDN4g9OhxQDtRLNKHZPZpwG6IORxRZrQiui0k2z45bZ2YN5hFNxtev7q7Kmk4RfV69exEpFt4btMF9hJQZpW+fyBqr8af8Ea427SL95COjowAAAABJRU5ErkJggg==); }
  .hp-master-filter .hp-drop-menu > label {
    display: none; }
.hp-drop-menu:focus > label {
  border-color: #E4FFEE; }
.hp-drop-menu.hp-active > label {
  color: #737373;
  border: 1px solid transparent;
  z-index: 201; }
  html.hp-high-contrast .hp-drop-menu.hp-active > label {
    color: #425563; }
  .hp-drop-menu.hp-active > label:hover:after {
    content: '';
    background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAALi4usLCw9LS1OTk5czMzLy8vtfX2Onp6cXFx////wAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAkALAAAAAAUABQAAAQyMMlJq7046827/2BWIMd0IMVWAGRyAql2AICQCHS5DXRADx4DDWAAEQCEkHLJbDqfmQgAOw==); }
.hp-drop-menu.hp-disabled > label {
  color: #737373; }
  .hp-drop-menu.hp-disabled > label:after {
    content: '';
    background-image: none; }
.hp-drop-menu.hp-disabled:focus label {
  border-color: transparent; }

.hp-search-combo {
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }
  .hp-search-combo .hp-search-combo-input {
    padding-right: 45px;
    margin: 0px; }
    .hp-search-combo .hp-search-combo-input.hp-error {
      background-image: none; }
  .hp-search-combo .hp-close {
    position: absolute;
    top: 9px;
    right: 25px;
    cursor: pointer;
    z-index: 1; }
  .hp-search-combo .hp-search-combo-control {
    position: absolute;
    top: 6px;
    right: 7px;
    width: 15px;
    height: 16px;
    background-image: url("../../img/hp-piano/hp-piano-icons.png");
    background-position: -120px -80px;
    background-repeat: no-repeat;
    cursor: pointer;
    z-index: 10; }
    .hp-search-combo .hp-search-combo-control:hover {
      background-position: -120px -60px; }
  .hp-search-combo.hp-disabled .hp-search-combo-control {
    cursor: auto; }
    .hp-search-combo.hp-disabled .hp-search-combo-control:hover {
      background-position: -120px -80px; }
  .hp-search-combo .hp-search-combo-menu {
    position: absolute;
    left: 2px;
    background-color: white;
    border: 1px solid #bfbfbf;
    -webkit-box-shadow: 3px 3px 5px 0px #999999;
    -moz-box-shadow: 3px 3px 5px 0px #999999;
    box-shadow: 3px 3px 5px 0px #999999;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 200;
    display: none; }
    .hp-search-combo .hp-search-combo-menu ol {
      overflow-y: auto;
      max-height: 200px;
      margin-bottom: 0px; }
      .hp-search-combo .hp-search-combo-menu ol li {
        margin-bottom: 0px;
        padding: 7px 10px;
        cursor: pointer; }
        .hp-search-combo .hp-search-combo-menu ol li:hover, .hp-search-combo .hp-search-combo-menu ol li.hp-selected {
          background-color: #e6e6e6; }
        .hp-search-combo .hp-search-combo-menu ol li .hp-error, .hp-search-combo .hp-search-combo-menu ol li .hp-help {
          display: inline-block;
          float: right; }
    .hp-search-combo .hp-search-combo-menu .hp-message {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
      box-sizing: border-box;
      background-color: #f3f3f3;
      color: #737373;
      padding: 7px 10px; }
      html.hp-high-contrast .hp-search-combo .hp-search-combo-menu .hp-message {
        color: #425563; }
    .hp-search-combo .hp-search-combo-menu.hp-active {
      display: block; }

.hp-contents .hp-value {
  display: none; }
.hp-contents .hp-options {
  margin-bottom: 0px; }
  .hp-contents .hp-options li {
    display: inline-block;
    margin-right: -4px; }
    .hp-contents .hp-options li a {
      color: #425563;
      display: block;
      padding: 2px 10px; }
      .hp-contents .hp-options li a:hover {
        background-color: #e6e6e6;
        color: #425563;
        text-decoration: none; }
    .hp-contents .hp-options li.hp-selected a {
      background-color: #E4FFEE;
      color: #000; }

.hp-rich-value {
  position: relative; }
  .hp-rich-value > * {
    display: inline-block;
    vertical-align: baseline;
    margin-right: 10px; }
  .hp-rich-value .hp-utilization-meter {
    position: relative;
    top: 1px;
    height: 10px; }

div.hp-graphed-value {
  position: relative; }
  div.hp-graphed-value div.hp-value-graph {
    margin-bottom: 5px; }
  div.hp-graphed-value div.hp-value {
    position: absolute;
    top: 64px;
    left: 40px;
    width: 120px;
    font-size: 32px;
    line-height: normal;
    text-align: center;
    vertical-align: middle; }
    div.hp-graphed-value div.hp-value .hp-units {
      display: block;
      font-size: 18px; }
  div.hp-graphed-value .hp-units-details {
    color: #666;
    font-family: 'HPLight', Arial, Helvetica, sans-serif;
    display: block;
    font-size: 18px; }

.hp-reveal-control .hp-control {
  display: none; }
.hp-reveal-control:hover .hp-value {
  display: none; }
.hp-reveal-control:hover .hp-control {
  display: block; }

.hp-tooltip {
  position: absolute;
  padding: 10px 15px;
  background-color: #00B388;
  color: #fff;
  font-size: 14px;
  z-index: 10000; }
  html.hp-high-contrast .hp-tooltip {
    color: black; }
  .hp-tooltip.hp-above:after {
    content: "";
    position: absolute;
    top: auto;
    bottom: -7px;
    left: 10px;
    right: auto;
    border-width: 9px 9px 0;
    border-color: #00B388 transparent;
    border-style: solid;
    display: block;
    width: 0; }
  .hp-tooltip.hp-below:after {
    content: "";
    position: absolute;
    top: -7px;
    bottom: auto;
    left: 10px;
    right: auto;
    border-width: 0 9px 9px 9px;
    border-color: #00B388 transparent;
    border-style: solid;
    display: block;
    width: 0; }
  .hp-tooltip.hp-below-right:after {
    content: "";
    position: absolute;
    top: -7px;
    bottom: auto;
    left: auto;
    right: 10px;
    border-width: 0 9px 9px 9px;
    border-color: #00B388 transparent;
    border-style: solid;
    display: block;
    width: 0; }

.hp-tbd {
  width: 100%;
  height: 100%;
  font-family: 'HPLight', Arial, Helvetica, sans-serif;
  font-size: 64px;
  line-height: normal;
  color: #ccc;
  margin: 0px; }

.hp-dialog .hp-notify {
  display: block;
  margin: 0px auto 20px auto;
  height: auto;
  width: auto;
  color: #425563; }
.hp-dialog .hp-collapsible {
  margin: 10px auto; }
  .hp-dialog .hp-collapsible label {
    font-size: 14px; }
.hp-dialog .hp-dependencies {
  line-height: 16px;
  margin-bottom: 0px;
  margin-left: 15px;
  max-height: 200px;
  overflow-y: auto; }
.hp-dialog .hp-dialog-variable-contents {
  margin: 10px auto;
  margin-bottom: 0px;
  overflow-y: auto;
  overflow-x: hidden; }
.hp-dialog .hp-prompt {
  margin: 10px 0px 10px 0px;
  font-weight: bold; }
.hp-dialog p {
  max-width: 460px; }
.hp-dialog .hp-add-form, .hp-dialog .hp-edit-form {
  position: static; }

.ui-dialog {
  background-color: white;
  color: #425563;
  -webkit-box-shadow: 3px 3px 12px 0px #999999;
  -moz-box-shadow: 3px 3px 12px 0px #999999;
  box-shadow: 3px 3px 12px 0px #999999;
  padding: 0px;
  max-width: 600px;
  border: none;
  border-radius: 0px; }
  html.hp-high-contrast .ui-dialog {
    color: black; }
  .ui-dialog .ui-dialog-titlebar {
    position: relative;
    background-color: #f3f3f3;
    border-bottom: 1px solid #d9d9d9;
    padding: 10px 20px;
    font-size: 16px; }
    .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close {
      position: absolute;
      top: 7px;
      right: 7px;
      width: 11px;
      height: 11px;
      margin: 0px;
      background-image: url("../../img/hp-piano/hp-piano-icons.png");
      background-position: -160px -20px;
      background-repeat: no-repeat; }
      .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close:hover {
        background-position: -160px 0px; }
      .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close .ui-icon {
        display: none; }
  .ui-dialog.hp-response-dialog .ui-dialog-titlebar-close {
    display: none; }
  .ui-dialog .ui-dialog-content {
    margin: 0px;
    padding: 30px;
    background-color: inherit; }
    .ui-dialog .ui-dialog-content .hp-progress {
      width: 100%; }
    .ui-dialog .ui-dialog-content > * {
      margin: 15px 0px; }
      .ui-dialog .ui-dialog-content > *:first-of-type {
        margin-top: 0px; }
      .ui-dialog .ui-dialog-content > *:last-of-type {
        margin-bottom: 0px; }
  .ui-dialog.hp-simple-dialog .ui-dialog-titlebar {
    display: none; }
  .ui-dialog.hp-simple-dialog .ui-dialog-content {
    margin: 20px 0px; }
  .ui-dialog.hp-simple-dialog .hp-controls {
    margin-top: 20px;
    text-align: right; }
  .ui-dialog.hp-splash-dialog .ui-dialog-titlebar {
    display: none; }
  .ui-dialog.hp-splash-dialog .ui-dialog-content {
    margin: 40px; }
  .ui-dialog .ui-dialog-buttonpane {
    padding: 10px;
    padding-bottom: 15px; }
    .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
      text-align: right; }
    .ui-dialog .ui-dialog-buttonpane button {
      margin-left: 10px; }

.hp-dialog-button-stack {
  margin-bottom: 0px; }
  .hp-dialog-button-stack li {
    display: table;
    margin-bottom: 15px; }
    .hp-dialog-button-stack li:last-of-type {
      margin-bottom: 0px; }
    .hp-dialog-button-stack li > * {
      display: table-cell; }
    .hp-dialog-button-stack li button {
      width: 190px;
      cursor: pointer; }
    .hp-dialog-button-stack li label {
      padding-left: 20px; }

.hp-dialog-remote-console-verification .float-left-div {
  line-height: 28px;
  float: left; }
.hp-dialog-remote-console-verification .float-right-div {
  float: right; }
.hp-dialog-remote-console-verification .centered-text-div {
  text-align: center; }

.ui-resizable {
  position: relative; }

.ui-resizable-handle {
  position: absolute;
  font-size: 0.1px;
  z-index: 99999;
  display: block; }

.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle {
  display: none; }

.ui-resizable-n {
  cursor: n-resize;
  height: 7px;
  width: 100%;
  top: -5px;
  left: 0px; }

.ui-resizable-s {
  cursor: s-resize;
  height: 7px;
  width: 100%;
  bottom: -5px;
  left: 0px; }

.ui-resizable-e {
  cursor: e-resize;
  width: 7px;
  right: -5px;
  top: 0px;
  height: 100%; }

.ui-resizable-w {
  cursor: w-resize;
  width: 7px;
  left: -5px;
  top: 0px;
  height: 100%; }

.ui-resizable-se {
  cursor: se-resize;
  width: 12px;
  height: 12px;
  right: 1px;
  bottom: 1px; }

.ui-resizable-sw {
  cursor: sw-resize;
  width: 9px;
  height: 9px;
  left: -5px;
  bottom: -5px; }

.ui-resizable-nw {
  cursor: nw-resize;
  width: 9px;
  height: 9px;
  left: -5px;
  top: -5px; }

.ui-resizable-ne {
  cursor: ne-resize;
  width: 9px;
  height: 9px;
  right: -5px;
  top: -5px; }

.ui-icon-gripsmall-diagonal-se {
  background-position: -64px -224px; }

.ui-download-iframe {
  visibility: hidden;
  left: 0;
  top: 0;
  height: 0;
  width: 0; }

.hp-flyout {
  position: absolute;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  padding: 20px;
  background-color: white;
  color: #425563;
  border: 1px solid #d9d9d9;
  z-index: 3000;
  -webkit-box-shadow: 0px 5px 6px 0px #999999;
  -moz-box-shadow: 0px 5px 6px 0px #999999;
  box-shadow: 0px 5px 6px 0px #999999; }
  .hp-flyout:after {
    content: "";
    position: absolute;
    top: auto;
    bottom: -9px;
    left: 9px;
    right: auto;
    border-width: 9px 9px 0;
    border-color: white transparent;
    border-style: solid;
    display: block;
    width: 0; }
  .hp-flyout.hp-flyout-below:after {
    content: "";
    position: absolute;
    top: -9px;
    bottom: auto;
    left: 9px;
    right: auto;
    border-width: 0 9px 9px;
    border-color: #d9d9d9 transparent;
    border-style: solid;
    display: block;
    width: 0; }
  .hp-flyout.hp-flyout-shifted:after, .hp-flyout.hp-flyout-overlap:after {
    content: "";
    display: none; }
  .hp-flyout h1 {
    font-size: 16px;
    line-height: 18px;
    color: #425563; }

.hp-delete, .hp-close {
  width: 14px;
  height: 14px;
  background-image: url("../../img/hp-piano/hp-piano-icons.png");
  background-position: -160px -20px;
  background-repeat: no-repeat; }
  .hp-delete:hover, .hp-close:hover {
    background-position: -160px 0px; }

.hp-edit {
  position: relative;
  width: 16px;
  height: 16px;
  background-image: url("../../img/hp-piano/hp-piano-icons.png");
  background-position: -280px -78px;
  background-repeat: no-repeat; }

.hp-reorder {
  width: 16px;
  height: 16px;
  background-image: url("../../img/hp-piano/hp-piano-icons.png");
  background-position: -160px -80px;
  background-repeat: no-repeat; }
  .hp-reorder:hover {
    background-position: -160px -60px; }

.hp-connect {
  width: 17px;
  height: 10px;
  background: transparent url("../../img/hp-piano/connect.png") no-repeat; }

.hp-jump {
  width: 16px;
  height: 16px;
  background-image: url("../../img/hp-piano/hp-piano-icons.png");
  background-position: -156px -96px;
  background-repeat: no-repeat; }
  .hp-jump:hover {
    background-position: -156px -76px; }

.hp-connect-long {
  width: 75px;
  height: 11px;
  background: transparent url("../../img/hp-piano/connect_long.png") no-repeat; }

table td > .hp-connect, table td > .hp-connect-long {
  margin: 4px 0px; }

div.hp-icon {
  background-image: url("../../img/hp-piano/hp-piano-icons.png");
  background-repeat: no-repeat; }
  div.hp-icon.hp-upload, div.hp-icon #hp-main-banner div.hp-banner-control {
    width: 16px;
    height: 17px;
    background-position: -220px -180px;
    margin: 0px;
    display: block; }
    .hp-selected div.hp-icon.hp-upload, div.hp-icon.hp-upload:hover, #hp-main-banner div.hp-banner-control:hover div.hp-icon.hp-upload, .hp-selected div.hp-icon #hp-main-banner div.hp-banner-control, div.hp-icon #hp-main-banner div.hp-banner-control:hover, #hp-main-banner div.hp-banner-control:hover div.hp-icon #hp-main-banner div.hp-banner-control {
      background-position: -220px -160px; }
  div.hp-icon.hp-power {
    width: 16px;
    height: 17px;
    background-position: -120px -180px; }
    div.hp-icon.hp-power:hover, #hp-main-banner div.hp-banner-control:hover div.hp-icon.hp-power {
      background-position: -120px -160px; }
    #hp-main-banner div.hp-banner-control.hp-on div.hp-icon.hp-power {
      background-position: -120[x -20px0px; }
    #hp-main-banner div.hp-banner-control.hp-standby div.hp-icon.hp-power {
      background-position: -120px -220px; }
  div.hp-icon.hp-uid {
    width: 14px;
    height: 16px;
    background-position: -139px -180px; }
    div.hp-icon.hp-uid:hover, #hp-main-banner div.hp-banner-control:hover div.hp-icon.hp-uid {
      background-position: -139px -160px; }
    #hp-main-banner div.hp-banner-control.hp-selected div.hp-icon.hp-uid {
      background-position: -139px -200px; }
  div.hp-icon.hp-console {
    width: 16px;
    height: 16px;
    background-position: -160px -180px; }
    div.hp-icon.hp-console:hover, #hp-main-banner div.hp-banner-control:hover div.hp-icon.hp-console {
      background-position: -160px -160px; }
  div.hp-icon.hp-disc {
    width: 16px;
    height: 16px;
    background-position: -180px -180px; }
    div.hp-icon.hp-disc:hover, #hp-main-banner div.hp-banner-control:hover div.hp-icon.hp-disc {
      background-position: -180px -160px; }

ol.hp-address {
  margin: 0px;
  font-size: 0px; }
  ol.hp-address > li {
    display: inline;
    font-size: 13px; }
    ol.hp-address > li:after {
      content: ':';
      color: #737373; }
    ol.hp-address > li:last-child:after {
      content: ''; }

@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg); }

  to {
    -webkit-transform: rotate(360deg); } }

@-moz-keyframes spin {
  from {
    -moz-transform: rotate(0deg); }

  to {
    -moz-transform: rotate(360deg); } }

@-ms-keyframes spin {
  from {
    -ms-transform: rotate(0deg); }

  to {
    -ms-transform: rotate(360deg); } }

@-o-keyframes spin {
  from {
    -o-transform: rotate(0deg); }

  to {
    -o-transform: rotate(360deg); } }

.hp-spinner {
  width: 100%;
  color: #737373; }
  html.hp-high-contrast .hp-spinner {
    color: #425563; }
  .hp-spinner > * {
    margin: 0px auto;
    text-align: center; }
  .hp-spinner .hp-spinner-image {
    height: 35px;
    width: 35px;
    background: transparent;
    background-image: url("../../img/hp-piano/hp-piano-icons.png");
    background-position: -320px -40px;
    background-repeat: no-repeat;
    -webkit-animation: spin 3s infinite linear forwards 0.7s;
    -moz-animation: spin 3s infinite linear forwards 0.7s;
    -ms-animation: spin 3s infinite linear forwards 0.7s;
    -o-animation: spin 3s infinite linear forwards 0.7s;
    margin: 20px auto; }
    .hp-global .hp-spinner .hp-spinner-image {
      background-position: -320px 0px; }

.hp-spinner-small {
  display: inline-block;
  width: 24px;
  color: #737373; }
  html.hp-high-contrast .hp-spinner-small {
    color: #425563; }
  .hp-spinner-small .hp-spinner-image {
    display: inline-block;
    height: 24px;
    width: 24px;
    background-image: url("../../img/hp-piano/hp-piano-icons.png");
    background-position: -320px 0px;
    background-repeat: no-repeat;
    -webkit-animation: spin 3s infinite linear forwards 0.7s;
    -moz-animation: spin 3s infinite linear forwards 0.7s;
    -ms-animation: spin 3s infinite linear forwards 0.7s;
    -o-animation: spin 3s infinite linear forwards 0.7s; }

.hp-progress {
  width: 200px;
  height: 10px;
  margin-right: 10px;
  background-color: #e5e5e5; }
  .hp-progress.hp-condensed {
    width: 50px;
    margin-right: 10px; }
  .hp-progress .hp-progress-done {
    height: 100%;
    background: #0a4b68;
    background: -webkit-gradient(linear, left top, right top, from(#0a4b68), to(#18b4fd));
    background: -moz-linear-gradient(left, #0a4b68, #18b4fd); }

span.hp-progress {
  display: inline-block; }

.hp-utilization-meter {
  position: relative;
  display: inline-block;
  width: 80px;
  height: 10px;
  background-color: #ddd;
  overflow-x: visible; }
  .hp-utilization-meter.hp-utilization-meter-extend .hp-threshold {
    border-bottom: 2px solid #ff8d6d;
    border-right: 2px solid #ff8d6d;
    left: 0px; }
  .hp-utilization-meter.hp-unset {
    text-align: center;
    background-color: #eee; }
    .hp-utilization-meter.hp-unset:after {
      position: relative;
      content: '/ / / / / / /';
      font-weight: bold;
      font-size: 11px;
      top: -3px;
      color: #999; }
    .hp-utilization-meter.hp-unset > * {
      display: none; }
  .hp-utilization-meter .hp-value-bar {
    position: relative;
    height: 100%;
    background-color: #00B388; }
    .hp-utilization-meter .hp-value-bar.hp-value-below {
      background-color: #42a425; }
      .hp-utilization-meter .hp-value-bar.hp-value-below .hp-value {
        background-color: #42a425; }
    .hp-utilization-meter .hp-value-bar.hp-value-above {
      background-color: #ff8d6d; }
      .hp-utilization-meter .hp-value-bar.hp-value-above .hp-value {
        background-color: #ff8d6d; }
    .hp-utilization-meter .hp-value-bar.hp-value-at-min .hp-value {
      display: block;
      right: -4px; }
    .hp-utilization-meter .hp-value-bar .hp-value {
      display: none;
      position: absolute;
      top: 2px;
      width: 4px;
      height: 6px;
      background-color: #00B388; }
  .hp-utilization-meter .hp-threshold {
    position: absolute;
    top: 0px;
    height: 10px;
    background-color: transparent; }
    .hp-utilization-meter .hp-threshold.hp-threshold-below {
      border-right: solid #faa 2px; }
    .hp-utilization-meter .hp-threshold.hp-threshold-above {
      border-right: solid #999 2px; }

.sparkline {
  width: 100px;
  height: 25px;
  background-color: transparent;
  border-left: solid #CCCCCC 1px;
  border-bottom: solid #CCCCCC 1px; }

/* jquery.selectBox */
/* Dropdown control */
.selectBox-dropdown {
  margin-bottom: 10px;
  padding: 7px 37px 7px 13px;
  position: relative;
  font-size: 13px;
  line-height: normal;
  text-decoration: none;
  border: 1px solid #d9d9d9;
  color: #425563;
  outline: none;
  vertical-align: middle;
  display: inline-block;
  cursor: default;
  /*&.selectBox-menuShowing {
  	-moz-border-radius-bottomleft: 0;
  	-moz-border-radius-bottomright: 0;
  	-webkit-border-bottom-left-radius: 0;
  	-webkit-border-bottom-right-radius: 0;
  	border-bottom-left-radius: 0;
  	border-bottom-right-radius: 0;
  }*/ }
  html.hp-high-contrast .selectBox-dropdown {
    color: black; }
  .hp-global .selectBox-dropdown {
    background-color: white;
    border-color: white;
    color: #323232;
    font-weight: bold; }
    .hp-global .selectBox-dropdown:hover {
      color: #000; }
    .hp-global .selectBox-dropdown:active {
      background-color: #ccc;
      border-color: #ccc;
      color: #000; }
    .hp-global .selectBox-dropdown:disabled, .hp-global .selectBox-dropdown.hp-disabled {
      background-color: #666;
      border-color: #666;
      color: #323232; }
  .selectBox-dropdown:hover {
    text-decoration: none; }
    .selectBox-dropdown:hover .selectBox-arrow {
      background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wwdAQoR2aLEVgAAAI1JREFUOMvt0z0KwkAQBeCPiJV2Bjs9jiDprOz3ADmjECy9jwSMzQQWif8gFnkwxbx585id3WXEzzC5yadY4oL2Ts8MC5xDN4g9OhxQDtRLNKHZPZpwG6IORxRZrQiui0k2z45bZ2YN5hFNxtev7q7Kmk4RfV69exEpFt4btMF9hJQZpW+fyBqr8af8Ea427SL95COjowAAAABJRU5ErkJggg==); }
  .selectBox-dropdown:focus {
    border-color: #E4FFEE; }
  .selectBox-dropdown .selectBox-label {
    width: 100%;
    font-weight: normal;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: top; }
  .selectBox-dropdown .selectBox-arrow {
    position: absolute;
    top: 0;
    right: 0;
    width: 24px;
    height: 100%;
    background-image: url(data:image/gif;base64,R0lGODlhFAAUALMAALi4usLCw9LS1OTk5czMzLy8vtfX2Onp6cXFx////wAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAAkALAAAAAAUABQAAAQyMMlJq7046827/2BWIMd0IMVWAGRyAql2AICQCHS5DXRADx4DDWAAEQCEkHLJbDqfmQgAOw==);
    background-position: right 4px;
    background-repeat: no-repeat; }

/* Dropdown menu */
.selectBox-dropdown-menu {
  position: absolute;
  z-index: 700;
  left: 0px;
  max-height: 200px;
  background: white;
  border: 1px solid #bfbfbf;
  -webkit-box-shadow: 3px 3px 5px 0px #999999;
  -moz-box-shadow: 3px 3px 5px 0px #999999;
  box-shadow: 3px 3px 5px 0px #999999;
  overflow: auto; }
  .selectBox-dropdown-menu.hp-global {
    -webkit-box-shadow: 2px 2px 2px 0px #444444;
    -moz-box-shadow: 2px 2px 2px 0px #444444;
    box-shadow: 2px 2px 2px 0px #444444; }

/* Inline control */
.selectBox-inline {
  width: 250px;
  outline: none;
  background: white;
  display: inline-block;
  overflow: auto; }

/* Options */
.selectBox-options,
.selectBox-options LI,
.selectBox-options LI A {
  list-style: none;
  display: block;
  cursor: default;
  padding: 0;
  margin: 0; }

.selectBox-options LI A {
  padding: 7px 10px;
  white-space: nowrap;
  overflow: hidden;
  background: 6px center no-repeat;
  color: #425563; }
  html.hp-high-contrast .selectBox-options LI A {
    color: black; }
  .selectBox-options LI A:hover {
    text-decoration: none; }

.selectBox-options LI.selectBox-hover A {
  background-color: #e6e6e6;
  text-decoration: none; }

.selectBox-options LI.selectBox-disabled A {
  color: #888;
  background-color: transparent; }

.selectBox-options LI.selectBox-selected A {
  font-weight: bold;
  background-color: #E4FFEE; }

.selectBox-options .selectBox-optgroup {
  color: #666;
  background: #EEE;
  font-weight: bold;
  padding: 0 .3em;
  white-space: nowrap; }

/* Disabled state */
.selectBox.selectBox-disabled {
  color: #888 !important; }

.selectBox-dropdown.selectBox-disabled .selectBox-arrow {
  opacity: .5;
  filter: alpha(opacity=50);
  border-color: #666; }

.selectBox-inline.selectBox-disabled {
  color: #888 !important; }

.selectBox-inline.selectBox-disabled .selectBox-options A {
  background-color: transparent !important; }

.hp-search-combo {
  position: relative;
  display: inline-block; }

/* Input textbox - do not specify a width here, it will be overwritten */
.ffb-input {
  float: left;
  color: #000;
  /* must specify along with watermark color */
  line-height: 16px; }

/* Color of watermark, if present */
.ffb-input.watermark {
  /* added and removed dynamically */
  color: #888;
  /* must specify along with input color */ }

/* Drop-down arrow, with sprited image */
.ffb-search-icon {
  display: inline-block;
  position: absolute;
  right: 5px;
  top: 6px;
  width: 19px;
  height: 19px;
  background-image: url("../../img/hp-piano/search-drop.png"); }

.ffb-no-results {
  padding: 2px;
  color: #888;
  font-style: italic;
  border-bottom: 1px solid #828790; }

/* Container for dropdown contents */
.ffb {
  position: absolute;
  /* this guy's parent div is hard-coded to position:relative */
  overflow: hidden;
  background: #fff;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  -webkit-box-shadow: 1px 1px 5px 0px #666666;
  -moz-box-shadow: 1px 1px 5px 0px #666666;
  box-shadow: 1px 1px 5px 0px #666666; }

/* Inner div for dropdown */
.ffb .content {
  overflow: auto; }

.ffb .content .row {
  border-bottom: 1px solid #d9d9d9;
  color: #425563;
  padding: 7px 10px;
  clear: both; }

.ffb-sel {
  cursor: pointer;
  cursor: hand;
  color: #425563 !important;
  background-color: #e6e6e6; }

.ffb-match {
  font-weight: bold;
  color: #000; }

.ffb-sel .ffb-match {
  color: #000; }

/* Paging */
.ffb .paging {
  vertical-align: middle;
  border-bottom: 1px solid #828790; }

.ffb .page, .ffb a.page {
  font-size: 85%;
  padding: 2px;
  border: solid 1px #339;
  background-color: #eef;
  margin: 2px; }

.ffb .box {
  width: 22px;
  margin: 2px; }

.ffb .summary {
  font-size: 85%; }

div.ui-datepicker {
  padding: 10px;
  line-height: normal;
  background-color: white;
  color: #737373;
  border: 1px solid #bfbfbf;
  z-index: 200;
  border-bottom: 5px solid #00B388;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-top: 1px solid #ccc; }
  div.ui-datepicker .ui-datepicker-header {
    background-image: none;
    border: none;
    border-radius: 0px;
    margin-bottom: 10px;
    text-align: center; }
    div.ui-datepicker .ui-datepicker-header .ui-datepicker-prev, div.ui-datepicker .ui-datepicker-header .ui-datepicker-next {
      display: block;
      width: 12px;
      height: 12px;
      background-image: url("../../img/hp-piano/hp-piano-icons.png");
      background-repeat: no-repeat; }
      div.ui-datepicker .ui-datepicker-header .ui-datepicker-prev .ui-icon, div.ui-datepicker .ui-datepicker-header .ui-datepicker-next .ui-icon {
        display: none; }
    div.ui-datepicker .ui-datepicker-header .ui-datepicker-prev {
      float: left;
      background-position: -200px -20px; }
      div.ui-datepicker .ui-datepicker-header .ui-datepicker-prev:hover {
        background-position: -200px 0px; }
    div.ui-datepicker .ui-datepicker-header .ui-datepicker-next {
      float: right;
      background-position: -200px -60px; }
      div.ui-datepicker .ui-datepicker-header .ui-datepicker-next:hover {
        background-position: -200px -40px; }
  div.ui-datepicker .ui-datepicker-buttonpane {
    text-align: right; }
    div.ui-datepicker .ui-datepicker-buttonpane button {
      margin-left: 5px; }

table.ui-datepicker-calendar thead th {
  padding: 3px 7px 3px 3px;
  border-left: none;
  text-align: right; }
table.ui-datepicker-calendar tbody tr {
  background-image: none; }
  table.ui-datepicker-calendar tbody tr td {
    padding: 2px;
    text-align: right; }
    table.ui-datepicker-calendar tbody tr td a {
      display: block;
      padding: 5px;
      border: 1px solid transparent; }
      table.ui-datepicker-calendar tbody tr td a:hover {
        background-color: #f3f3f3;
        text-decoration: none; }
      table.ui-datepicker-calendar tbody tr td a.ui-state-active {
        background-color: #E4FFEE;
        font-weight: bold; }
table.ui-datepicker-calendar .ui-state-default {
  background-image: none;
  color: #425563; }
  table.ui-datepicker-calendar .ui-state-default:hover {
    text-decoration: none; }

div.hp-date-range {
  padding: 10px; }
  div.hp-select div.hp-date-range > label, div.hp-select div.hp-date-range > div.hp-date {
    display: block;
    line-height: normal; }
  div.hp-select div.hp-date-range input[type="date"] {
    width: 120px; }

.hp-modal-overlay {
  background: #ffffff none repeat scroll 0 0;
  display: none;
  height: 100%;
  left: 0;
  filter: alpha(opacity=50);
  opacity: 0.5;
  top: 0;
  width: 100%;
  z-index: 499;
  display: none;
  position: fixed; }

.hp-modal {
  position: absolute;
  left: 20%;
  right: 20%;
  top: 20%;
  margin-left: auto;
  margin-right: auto;
  z-index: 500; }
  .hp-modal > * {
    margin: 0px auto; }

.hp-toolbar {
  margin-top: 20px;
  border-top: 1px solid #d9d9d9;
  padding-top: 15px; }
  @media print {
    .hp-toolbar {
      display: none; } }
  .hp-toolbar > * {
    vertical-align: baseline; }
  .hp-toolbar .hp-align-right {
    text-align: right; }

.hp-toggle {
  display: inline-block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #fff;
  border: 1px solid #bbb;
  font-size: 14px;
  color: #000;
  margin-bottom: 10px;
  white-space: nowrap;
  overflow-x: hidden;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none; }
  .hp-toggle:focus {
    border: 1px solid #E4FFEE;
    outline: none; }
    .hp-toggle:focus .hp-toggle-thumb {
      background-color: #333; }
  .hp-toggle:hover .hp-toggle-thumb {
    background-color: #333; }
  .hp-toggle.hp-error {
    border: 2px solid #ff8d6d; }
  .hp-toggle[disabled] {
    color: #999; }
  .hp-toggle ol {
    position: relative;
    margin-bottom: 0px;
    -webkit-transition: left 0.2s;
    -moz-transition: left 0.2s;
    transition: left 0.2s; }
  .hp-toggle li {
    display: inline-block;
    margin-right: -4px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    padding: 5px 10px;
    margin: 0px;
    background-color: white;
    color: #000; }
    .hp-toggle li.hp-on {
      padding-right: 16px; }
    .hp-toggle li.hp-off {
      padding-left: 16px; }
  .hp-toggle .hp-toggle-thumb {
    position: absolute;
    top: 2px;
    left: 3px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px;
    height: 20px;
    width: 6px;
    background-color: #999;
    -webkit-transition: left 0.2s;
    -moz-transition: left 0.2s;
    transition: left 0.2s; }
  .hp-toggle.hp-checked .hp-toggle-thumb {
    background-color: #007dba; }

.hp-plot .tickLabel {
  color: #737373;
  font-size: 12px; }
.hp-plot .x1Axis .tickLabel {
  padding-top: 5px; }
.hp-plot .y1Axis .tickLabel {
  padding-right: 5px; }
.hp-plot .y2Axis .tickLabel {
  padding-left: 5px; }
.hp-flyout .hp-plot {
  width: 300px;
  height: 200px; }

.hp-plot-legend {
  margin: 10px 0px; }
  .hp-plot-legend table thead th {
    background: none;
    border-left: none;
    padding: 2px 10px 2px 0px; }
  .hp-plot-legend tr {
    background: none; }
    .hp-plot-legend tr td {
      padding: 2px 10px 2px 0px; }
      .hp-plot-legend tr td.legendColorBox {
        padding-top: 4px;
        padding-right: 20px; }
      .hp-plot-legend tr td.legendLabel {
        color: #737373; }

.hp-active-drag {
  background-color: #D6D6D6; }

.hp-hover-drop-target {
  background-color: #66D0FA; }

.hp-pending-changes-message {
  font-weight: bold; }

::-webkit-scrollbar {
  width: 10px;
  height: 10px; }

::-webkit-scrollbar-track:hover {
  -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2); }

::-webkit-scrollbar-thumb {
  background-color: rgba(164, 164, 164, 0.5); }

/* jQuery UI Slider */
.ui-slider {
  position: relative;
  text-align: left; }
  .ui-slider:after {
    position: absolute;
    top: 7px;
    left: 0px;
    content: '';
    height: 2px;
    width: 100%;
    background-color: #d9d9d9; }
  .ui-slider:hover:after {
    content: '';
    background-color: #cccccc; }
  .ui-slider:hover .ui-slider-handle {
    background-position: -356px 3px; }
  .ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 20px;
    height: 20px;
    cursor: default;
    background-image: url("../../img/hp-piano/hp-piano-icons.png");
    background-position: -356px -17px;
    background-repeat: no-repeat; }
    .ui-slider .ui-slider-handle:focus, .ui-slider .ui-slider-handle:hover {
      outline: none;
      background-position: -356px 3px; }
  .ui-slider .ui-slider-range {
    position: absolute;
    z-index: 1;
    display: block;
    border: 0;
    background-position: 0 0; }

.ui-slider-horizontal {
  height: 16px; }
  .ui-slider-horizontal .ui-slider-handle {
    top: -2px;
    margin-left: -10px; }

.ui-slider-vertical {
  width: 5px;
  height: 100px; }
  .ui-slider-vertical .ui-slider-handle {
    left: -7px;
    margin-left: 0;
    margin-bottom: -10px; }

.ui-widget-content {
  border: none; }

/* Interaction states
----------------------------------*/
/*.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
  border: 1px solid #d3d3d3;
  background: #e6e6e6;
  font-weight: normal;
  color: #555555;
}

.ui-state-default a {
  color: #555555;
  text-decoration: none;
  &:link, &:visited {
    color: #555555;
    text-decoration: none;
  }
}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
  border: 1px solid #999999;
  background: #dadada;
  font-weight: normal;
  color: #212121;
}

.ui-state-hover a {
  color: #212121;
  text-decoration: none;
  &:hover {
    color: #212121;
    text-decoration: none;
  }
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
  border: 1px solid #aaaaaa;
  background: white;
  font-weight: normal;
  color: #212121;
}

.ui-state-active a {
  color: #212121;
  text-decoration: none;
  &:link, &:visited {
    color: #212121;
    text-decoration: none;
  }
}

.ui-widget :active {
  outline: none;
}*/
/* Icons
----------------------------------*/
/* states and images */
.ui-icon {
  width: 16px;
  height: 16px;
  background-image: url("../../img/hp-piano/ui-icons_222222_256x240.png"); }

.ui-widget-content .ui-icon, .ui-widget-header .ui-icon {
  background-image: url("../../img/hp-piano/ui-icons_222222_256x240.png"); }

.ui-state-default .ui-icon {
  background-image: url("../../img/hp-piano/ui-icons_888888_256x240.png"); }

.ui-state-hover .ui-icon, .ui-state-focus .ui-icon, .ui-state-active .ui-icon {
  background-image: url("../../img/hp-piano/ui-icons_454545_256x240.png"); }

.ui-state-highlight .ui-icon {
  background-image: url("../../img/hp-piano/ui-icons_2e83ff_256x240.png"); }

.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {
  background-image: url("../../img/hp-piano/ui-icons_cd0a0a_256x240.png"); }