/* Help box */
.ola-query-help {
  position: relative;
  background: white;    
  width: 300px;
  max-width: 100%;
  position: absolute;
  top: 100%;
  margin-top: 12px;
  left: 0;
  font-size: 14px;
  border-radius: 5px;
  z-index: 20; /* Higher than contenteditable 2 */
  box-shadow: $small-box-shadow;

  strong {
    display: block;
  }

  &:after, &:before {
    bottom: 100%;
    left: 30px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
  }
  &:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #ffffff;
    border-width: 10px;
    margin-left: -10px;
  }
  &:before {
    border-color: rgba(221, 221, 221, 0);
    border-bottom-color: #ccc;
    border-width: 11px;
    margin-left: -11px;
  }
}


/**
 * Content
 */
.ola-query-help-content {
  padding: 16px 32px 16px 16px;
  line-height: 1.4;
}