/*   1factory (c) 2018, all rights reserved
 *   Application CSS    :: rollup of LESS components
 *   Edition            :: 24-SEPT-2018
 *
 *   Build              :: Use this file as input to a LESSC command 'lessc --autoprefix ./app.less ../lib/all.css'
 *                         Implemented in the command script commands/make-css.sh
 */
/*  #region  PERCENTAGE WIDTHS  */
.pct0 {
  width: 0;
}
.pct1 {
  width: 1%;
}
.pct2 {
  width: 2%;
}
.pct3 {
  width: 3%;
}
.pct4 {
  width: 4%;
}
.pct5 {
  width: 5%;
}
.pct6 {
  width: 6%;
}
.pct7 {
  width: 7%;
}
.pct8 {
  width: 8%;
}
.pct9 {
  width: 9%;
}
.pct10 {
  width: 10%;
}
.pct11 {
  width: 11%;
}
.pct12 {
  width: 12%;
}
.pct13 {
  width: 13%;
}
.pct14 {
  width: 14%;
}
.pct15 {
  width: 15%;
}
.pct16 {
  width: 16%;
}
.pct17 {
  width: 17%;
}
.pct18 {
  width: 18%;
}
.pct19 {
  width: 19%;
}
.pct20 {
  width: 20%;
}
.pct21 {
  width: 21%;
}
.pct22 {
  width: 22%;
}
.pct23 {
  width: 23%;
}
.pct24 {
  width: 24%;
}
.pct25 {
  width: 25%;
}
.pct26 {
  width: 26%;
}
.pct27 {
  width: 27%;
}
.pct28 {
  width: 28%;
}
.pct29 {
  width: 29%;
}
.pct30 {
  width: 30%;
}
.pct31 {
  width: 31%;
}
.pct32 {
  width: 32%;
}
.pct33 {
  width: 33%;
}
.pct34 {
  width: 34%;
}
.pct35 {
  width: 35%;
}
.pct36 {
  width: 36%;
}
.pct37 {
  width: 37%;
}
.pct38 {
  width: 38%;
}
.pct39 {
  width: 39%;
}
.pct40 {
  width: 40%;
}
.pct41 {
  width: 41%;
}
.pct42 {
  width: 42%;
}
.pct43 {
  width: 43%;
}
.pct44 {
  width: 44%;
}
.pct45 {
  width: 45%;
}
.pct46 {
  width: 46%;
}
.pct47 {
  width: 47%;
}
.pct48 {
  width: 48%;
}
.pct49 {
  width: 49%;
}
.pct50 {
  width: 50%;
}
.pct51 {
  width: 51%;
}
.pct52 {
  width: 52%;
}
.pct53 {
  width: 53%;
}
.pct54 {
  width: 54%;
}
.pct55 {
  width: 55%;
}
.pct56 {
  width: 56%;
}
.pct57 {
  width: 57%;
}
.pct58 {
  width: 58%;
}
.pct59 {
  width: 59%;
}
.pct60 {
  width: 60%;
}
.pct61 {
  width: 61%;
}
.pct62 {
  width: 62%;
}
.pct63 {
  width: 63%;
}
.pct64 {
  width: 64%;
}
.pct65 {
  width: 65%;
}
.pct66 {
  width: 66%;
}
.pct67 {
  width: 67%;
}
.pct68 {
  width: 68%;
}
.pct69 {
  width: 69%;
}
.pct70 {
  width: 70%;
}
.pct71 {
  width: 71%;
}
.pct72 {
  width: 72%;
}
.pct73 {
  width: 73%;
}
.pct74 {
  width: 74%;
}
.pct75 {
  width: 75%;
}
.pct76 {
  width: 76%;
}
.pct77 {
  width: 77%;
}
.pct78 {
  width: 78%;
}
.pct79 {
  width: 79%;
}
.pct80 {
  width: 80%;
}
.pct81 {
  width: 81%;
}
.pct82 {
  width: 82%;
}
.pct83 {
  width: 83%;
}
.pct84 {
  width: 84%;
}
.pct85 {
  width: 85%;
}
.pct86 {
  width: 86%;
}
.pct87 {
  width: 87%;
}
.pct88 {
  width: 88%;
}
.pct89 {
  width: 89%;
}
.pct90 {
  width: 90%;
}
.pct91 {
  width: 91%;
}
.pct92 {
  width: 92%;
}
.pct93 {
  width: 93%;
}
.pct94 {
  width: 94%;
}
.pct95 {
  width: 95%;
}
.pct96 {
  width: 96%;
}
.pct97 {
  width: 97%;
}
.pct98 {
  width: 98%;
}
.pct99 {
  width: 99%;
}
.pct100 {
  width: 100%;
}
/* #endregion */
/*  #region  UNIT WIDTHS  */
.unit--default-key {
  min-width: 164px;
  max-width: 164px;
}
.unit--half-default-key {
  max-width: 82px;
  min-width: 82px;
}
.unit--three-quarters-default-key {
  max-width: 123px;
  min-width: 123px;
}
.unit--double-default-key {
  max-width: 328px;
  min-width: 328px;
}
.unit--double-default-key-and-one-half {
  max-width: 378px;
  min-width: 378px;
}
.unit--revision-key {
  min-width: 80px;
  max-width: 80px;
}
.unit--one-half {
  min-width: 50px;
  max-width: 50px;
}
.unit--two-thirds {
  min-width: 67px;
  max-width: 67px;
}
.unit--one {
  min-width: 100px;
  max-width: 100px;
}
.unit--one-and-one-half {
  min-width: 150px;
  max-width: 150px;
}
.unit--two {
  min-width: 200px;
  max-width: 200px;
}
.unit--two-grouped {
  min-width: 190px;
  max-width: 190px;
}
.unit--two-more {
  width: 235px;
}
.unit--three {
  min-width: 315px;
  max-width: 315px;
}
.unit--four {
  min-width: 685px;
  max-width: 685px;
}
.unit--five {
  min-width: 740px;
  max-width: 740px;
}
.unit--full {
  min-width: 890px;
  max-width: 890px;
}
.unit--pct__one-quarter {
  max-width: 25%;
  min-width: 25%;
}
.unit--pct__one-third {
  max-width: 33%;
  min-width: 33%;
}
.unit--pct__one-half {
  max-width: 50%;
  min-width: 50%;
}
.unit--pct__two-thirds {
  max-width: 67%;
  min-width: 67%;
}
.unit--pct__three-quarters {
  max-width: 75%;
  min-width: 75%;
}
.unit--pct__four-fifths {
  max-width: 80%;
  min-width: 80%;
}
.unit-pct-95 {
  max-width: 95%;
  min-width: 95%;
}
.unit-pct__whole {
  max-width: 100%;
  min-width: 100%;
}
.unit--serial-number {
  max-width: 378px;
  min-width: 378px;
}
.sel-100 {
  width: 100%;
}
.split-3070l {
  width: 30%;
  float: left;
}
.split-3070r {
  width: 70%;
  float: right;
}
.zebra-100 {
  width: 100%;
}
.zebra-25 {
  min-width: 25%;
  max-width: 25%;
}
.zebra-25 .Zebra_DatePicker_Icon_Wrapper,
.zebra-100 .Zebra_DatePicker_Icon_Wrapper {
  width: 100%;
}
/* #endregion */
/*  COLORS  based on https://clrs.cc/  */
/*  See MACROS in less/colors.less  */
/*  #region  BACKGROUNDS  */
.bg-navy {
  background-color: #001f3f;
}
.bg-blue {
  background-color: #0074d9;
}
.bg-aqua {
  background-color: #7fdbff;
}
.bg-teal {
  background-color: #39cccc;
}
.bg-olive {
  background-color: #3d9970;
}
.bg-green {
  background-color: #2ecc40;
}
.bg-lime {
  background-color: #01ff70;
}
.bg-yellow {
  background-color: #ffdc00;
}
.bg-orange {
  background-color: #ff851b;
}
.bg-red {
  background-color: #ff4136;
}
.bg-fuchsia {
  background-color: #f012be;
}
.bg-purple {
  background-color: #b10dc9;
}
.bg-maroon {
  background-color: #85144b;
}
.bg-white {
  background-color: #ffffff;
}
.bg-gray {
  background-color: #aaaaaa;
}
.bg-silver {
  background-color: #dddddd;
}
.bg-black {
  background-color: #111111;
}
.warning {
  background-color: #ffdc00;
}
.hilight {
  background-color: #fff8d0 !important;
}
/* #endregion */
/*  #region  COLORS  */
.navy {
  color: #001f3f;
}
.blue {
  color: #0074d9;
}
.aqua {
  color: #7fdbff;
}
.teal {
  color: #39cccc;
}
.olive {
  color: #3d9970;
}
.green {
  color: #2ecc40;
}
.lime {
  color: #01ff70;
}
.yellow {
  color: #ffdc00;
}
.orange {
  color: #ff851b;
}
.red {
  color: #ff4136;
}
.fuchsia {
  color: #f012be;
}
.purple {
  color: #b10dc9;
}
.maroon {
  color: #85144b;
}
.white {
  color: #ffffff;
}
.silver {
  color: #dddddd;
}
.gray {
  color: #aaaaaa;
}
.black {
  color: #111111;
}
/*  #endregion  */
/*  #region  BORDERS  */
/* Use with another border utility that sets border-width and style
   i.e .border { border-width: 1px; border-style: solid; }  */
.border--navy {
  border-color: #001f3f;
}
.border--blue {
  border-color: #0074d9;
}
.border--aqua {
  border-color: #7fdbff;
}
.border--teal {
  border-color: #39cccc;
}
.border--olive {
  border-color: #3d9970;
}
.border--green {
  border-color: #2ecc40;
}
.border--lime {
  border-color: #01ff70;
}
.border--yellow {
  border-color: #ffdc00;
}
.border--orange {
  border-color: #ff851b;
}
.border--red {
  border-color: #ff4136;
}
.border--fuchsia {
  border-color: #f012be;
}
.border--purple {
  border-color: #b10dc9;
}
.border--maroon {
  border-color: #85144b;
}
.border--white {
  border-color: #ffffff;
}
.border--gray {
  border-color: #aaaaaa;
}
.border--silver {
  border-color: #dddddd;
}
.border--black {
  border-color: #111111;
}
/* Fills for SVG */
.fill-navy {
  fill: #001f3f;
}
.fill-blue {
  fill: #0074d9;
}
.fill-aqua {
  fill: #7fdbff;
}
.fill-teal {
  fill: #39cccc;
}
.fill-olive {
  fill: #3d9970;
}
.fill-green {
  fill: #2ecc40;
}
.fill-lime {
  fill: #01ff70;
}
.fill-yellow {
  fill: #ffdc00;
}
.fill-orange {
  fill: #ff851b;
}
.fill-red {
  fill: #ff4136;
}
.fill-fuchsia {
  fill: #f012be;
}
.fill-purple {
  fill: #b10dc9;
}
.fill-maroon {
  fill: #85144b;
}
.fill-white {
  fill: #ffffff;
}
.fill-gray {
  fill: #aaaaaa;
}
.fill-silver {
  fill: #dddddd;
}
.fill-black {
  fill: #111111;
}
/*  #endregion  */
/*  #region  STROKES  */
.stroke-navy {
  stroke: #001f3f;
}
.stroke-blue {
  stroke: #0074d9;
}
.stroke-aqua {
  stroke: #7fdbff;
}
.stroke-teal {
  stroke: #39cccc;
}
.stroke-olive {
  stroke: #3d9970;
}
.stroke-green {
  stroke: #2ecc40;
}
.stroke-lime {
  stroke: #01ff70;
}
.stroke-yellow {
  stroke: #ffdc00;
}
.stroke-orange {
  stroke: #ff851b;
}
.stroke-red {
  stroke: #ff4136;
}
.stroke-fuchsia {
  stroke: #f012be;
}
.stroke-purple {
  stroke: #b10dc9;
}
.stroke-maroon {
  stroke: #85144b;
}
.stroke-white {
  stroke: #ffffff;
}
.stroke-gray {
  stroke: #aaaaaa;
}
.stroke-silver {
  stroke: #dddddd;
}
.stroke-black {
  stroke: #111111;
}
/*  #endregion  */
/*  #region  BASE  */
html,
body {
  font-family: "Open Sans", Helevetica, Arial;
  font-size: 13pt;
  overflow: hidden;
}
body.whitesmoke {
  background-color: #f2f2f2;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Open Sans', Helvetica, sans-serif;
  font-weight: 300;
}
h1 {
  font-size: 3em;
  font-weight: 500;
  color: #000;
}
h2 {
  font-size: 2.5em;
  color: #222;
}
h3 {
  font-size: 2em;
  color: #333;
}
input {
  font-size: 13pt;
  padding-left: 4px;
}
/* #endregion */
/*  #region  APP CONTAINER  */
.app-container {
  overflow-x: hidden;
  overflow-y: scroll;
}
.app-container .multiselect {
  margin-left: 120px;
  margin-top: 10px;
}
.app-container.no-y {
  overflow-y: hidden;
}
.app-container.scroll-both {
  overflow-x: scroll;
  overflow-y: scroll;
}
/* #endregion */
/*  #region  HELP  */
.shell--help {
  background-color: #222;
  color: #FFF;
  cursor: help;
  flex: 0 0 25px;
  font-size: 12pt;
  line-height: 24px;
  text-align: center;
}
.shell--help:hover {
  background-color: #ff851b;
  color: #000;
}
/* #endregion */
/*  #region  SCALE  */
.scale {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}
/* #endregion */
.sub-flex-set {
  display: flex;
  width: 100%;
}
.loading-screen {
  width: 100%;
  height: 100vh;
  z-index: 99;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(128, 128, 128, 0.7);
}
.loading-screen .loading-msg {
  color: #005cd9;
  margin-bottom: 5px;
  font-size: 32px;
}
.loading-screen .loading-msg:before {
  content: "\f03D";
  font: normal normal normal 14px/1 "Black Tie";
  display: inline-block;
  font-size: inherit;
  vertical-align: -14.28571429%;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  margin-right: 5px;
  -webkit-animation: bt-spin 2s infinite linear;
          animation: bt-spin 2s infinite linear;
}
/*  #region  INPUT  */
input,
button,
select,
textarea,
.btn,
.btn-helper {
  border: 1px solid #d8d8d8;
  height: 40px;
  transition: background-color 350ms ease, border 350ms ease, color 350ms ease;
}
textarea {
  min-height: 40px;
}
input,
textarea {
  padding: 0 4px;
  width: 100%;
}
input[type=checkbox].checkbox--styled {
  display: none;
}
input[type=checkbox].checkbox--styled:checked + .checkbox:before {
  content: "\2713";
}
input.error,
button.error,
select.error,
textarea.error,
.element.error {
  border: 1px solid #ff4136;
}
input.duplicate {
  background: transparent url(../img/icons/warning-orange.svg) no-repeat right 5px center;
  background-size: 18px;
  color: #FF7700;
  background-color: #fff8d0;
}
select.duplicate {
  background: transparent url(../img/icons/warning-orange.svg) no-repeat right 12px center;
  background-size: 18px;
  color: #FF7700;
  background-color: #fff8d0;
}
/*  
 * --- CLEARING ELEMENT FOR SELECTED INPUTS ---
 */
input,
.clear {
  height: 40px;
}
.clear {
  border: 1px solid #d8d8d8;
  line-height: 39px;
  transition: background-color 300ms ease;
}
input + .clear {
  border-left: none;
}
.clear {
  color: #888;
  cursor: pointer;
  flex: 0 0 40px;
  font-size: 8pt;
  text-align: center;
}
.clear:hover {
  color: #111111;
}
.clear:active {
  background-color: rgba(0, 116, 217, 0.3333);
}
.input-placeholder {
  width: 100%;
  padding: 0 6px;
  height: 40px;
}
span.input-sizer {
  display: none;
  white-space: pre !important;
}
/* #endregion */
/*  #region  CHECKBOX  */
.checkbox {
  cursor: pointer;
}
.checkbox:before {
  background-color: #FFFFFF;
  border: 1px solid #d8d8d8;
  color: #3d9970;
  content: "";
  display: inline-block;
  font-size: 18pt;
  height: 40px;
  text-align: center;
  width: 40px;
}
.check .checkbox:before {
  font-size: 16pt;
  height: 30px;
  width: 30px;
  margin-top: 4px;
  margin-left: 15px;
}
/* #endregion */
/*  #region  DESCRIPTORS  */
.descriptors {
  height: 30px;
  margin: 0;
  padding-right: 5px;
  position: relative;
  top: -90px;
  width: 100%;
}
.descriptor i {
  margin-left: 2px;
  margin-right: 7px;
  color: black;
}
.descriptor {
  border: 1px solid #999999;
  cursor: pointer;
  font-size: 10pt;
  font-weight: 300;
  height: 30px;
  line-height: 29px;
  margin-left: 5px;
  padding: 0 5px;
  transition: background-color 500ms ease;
  width: auto;
}
.descriptor:active {
  background-color: #3d9970;
}
.descriptor:focus,
.descriptor:hover {
  border: 1px solid black;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}
.descriptor.read-only {
  background-color: #ffffff;
}
.descriptor.read-only:focus,
.descriptor.read-only:hover {
  border: 1px solid #999999;
  box-shadow: none;
  cursor: default;
}
/* #endregion */
/*  #region  ANNOUNCEMENT  */
.announce {
  -webkit-animation-duration: 250ms;
          animation-duration: 250ms;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.25);
  color: white;
  font-weight: 300;
  left: 0;
  min-height: 40px;
  padding: 10px 40px;
  position: fixed;
  top: 0;
  transition: all 250ms;
  width: 100%;
  z-index: 7500;
}
.announce a,
.announce .dismiss {
  z-index: 7501;
}
.announce a {
  color: #111111;
}
.announce a:hover {
  font-weight: 400;
}
.announce .dismiss {
  cursor: pointer;
  font-size: 12pt;
  font-weight: 300;
  position: absolute;
  right: 5px;
  text-align: center;
  text-transform: uppercase;
  top: 8px;
  width: 20px;
}
.announce .dismiss:hover {
  border: 1px solid white;
}
.announce.error,
.announce.critical {
  background: #ff4136 url(../img/icons/error-triangle.svg) 8px 10px no-repeat;
  background-size: 20px 20px;
  color: #111111;
}
.announce.critical {
  font-size: 23px;
  font-weight: 600;
  line-height: 54px;
  min-height: 75px;
}
.announce.success {
  background: #2ecc40 url(../img/icons/checkmark6-white.svg) 8px 10px no-repeat;
  background-size: 20px 20px;
}
.announce.warning {
  background: #ffdc00 url(../img/icons/warning2.svg) 8px 10px no-repeat;
  background-size: 20px 20px;
  color: #111111;
}
.announce.info {
  background: #39cccc url(../img/icons/chat51.svg) 8px 10px no-repeat;
  background-size: 20px 20px;
}
.announce.system {
  background: #111111 url(../img/icons/notification4.svg) 8px 10px no-repeat;
  background-size: 20px 20px;
}
/* #endregion */
/*  #region  BUTTON  */
.btn {
  font-size: 10pt;
  text-transform: uppercase;
}
.btn--cancel,
.btn-helper--cancel {
  background-color: #ffffff;
  border: 2px solid #d2691e;
  color: #d2691e;
}
.btn--cancel:hover {
  background-color: #d2691e;
  border: 2px solid #d2691e;
  color: #ffffff;
}
.btn--cancel.disabled,
.btn--cancel.disabled:hover {
  background-color: #ffffff;
  border: 2px solid rgba(210, 105, 30, 0.3333);
  border-left: 0;
  color: rgba(210, 105, 30, 0.3333);
  cursor: default;
}
.btn--default,
.btn-helper--default {
  background-color: #ffffff;
  border: 2px solid #aaaaaa;
  color: #111111;
}
.btn--default:hover {
  background-color: #565656;
  border: 2px solid #565656;
  color: #ffffff;
}
.btn--default.disabled,
.btn--default.disabled:hover {
  background-color: #ffffff;
  border: 2px solid #aaaaaa;
  border-left: 0;
  color: #aaaaaa;
  cursor: default;
}
.btn--primary,
.btn-helper--primary {
  background-color: #ffffff;
  border: 2px solid #0074d9;
  color: #0074d9;
}
.btn--primary:hover,
.choice.selected,
.choice.selected:hover {
  background-color: #0074d9;
  border: 2px solid #0074d9;
  color: #ffffff;
}
.btn--primary.disabled,
.btn--primary.disabled:hover {
  background-color: #ffffff;
  border: 2px solid rgba(0, 116, 217, 0.3333);
  border-left: 0;
  color: rgba(0, 116, 217, 0.3333);
  cursor: not-allowed;
}
.btn--auto,
.choice--auto {
  width: auto;
  padding: 0px 15px;
}
.btn-helper + .btn {
  border-left: 0;
  margin-left: 0;
}
.btn-helper {
  font-size: 7pt;
  padding-top: 4px;
  text-align: center;
  text-transform: uppercase;
  width: 28px;
}
.btn-helper--cancel {
  border-right: 1px solid #d2691e;
  margin-right: 0;
}
.btn-helper--cancel.disabled,
.btn-helper--cancel.disabled:hover {
  background-color: #ffffff;
  border: 2px solid rgba(210, 105, 30, 0.3333);
  color: rgba(210, 105, 30, 0.3333);
  cursor: default;
}
.btn-helper--default {
  border-right: 1px solid #aaaaaa;
  margin-right: 0;
}
.btn-helper--primary {
  border-right: 1px solid #0074d9;
  margin-right: 0;
}
.btn-helper--primary.disabled,
.btn-helper--primary.disabled:hover {
  background-color: #ffffff;
  border: 2px solid rgba(0, 116, 217, 0.3333);
  color: rgba(0, 116, 217, 0.3333);
  cursor: not-allowed;
}
.btn + .btn-helper {
  margin-left: 20px;
}
/* #endregion */
/*  #region  CHOICES  */
.choice {
  border: 1px solid #d8d8d8;
  height: 40px;
  transition: background-color 150ms ease, border 150ms ease;
}
.choice:hover:not(:disabled) {
  background-color: rgba(0, 116, 217, 0.5);
  border: 1px solid rgba(0, 116, 217, 0.5);
  color: #111111;
}
.choice {
  cursor: pointer;
  text-align: center;
  text-transform: uppercase;
}
.choice:disabled {
  cursor: default;
}
.choice + .choice,
.choice + .choice.selected {
  border-left: none;
}
/* #endregion */
/*  #region  SELECTIZE rules */
.selectize-input,
.selectize-control.single .selectize-input {
  border-color: #d8d8d8;
  border-radius: 0;
  font-size: 13pt;
  height: 40px;
  line-height: 39px;
  margin: 0;
  padding: 0 6px;
}
.selectize-input input {
  font-size: 13pt;
  height: 40px;
  line-height: 39px;
  margin: 0;
  padding: 0 6px;
}
.selectize-dropdown-content {
  background-color: #ffffff;
  box-shadow: 2px 2px 6px rgba(150, 150, 150, 0.33);
  border: 1px solid #d8d8d8;
  max-height: 285px;
  font-size: 13pt;
  /* added by oleg */
}
.selectize-dropdown .active {
  background-color: #ff851b;
  color: #111111;
}
.selectize-dropdown .create {
  color: #111111;
}
.selectize-dropdown {
  z-index: 3000;
}
/* added by oleg */
.selectize-control .draft {
  color: #464646;
}
.selectize-control .draft .ver {
  color: #FFDC00;
}
.selectize-control .rev {
  /*blue*/
  color: #0074d9;
  margin-left: 10px;
  margin-right: 10px;
}
.selectize-control .ver {
  /*olive*/
  color: #3d9970;
}
.selectize-control .descr {
  font-weight: 200;
}
.selectize-input.error {
  border: 1px solid #ff4136 !important;
}
.pane-grid--body .selector .selectize-control {
  width: 100%;
}
.pane-grid--body .selector .selectize-input,
.pane-grid--body .selector .selectize-control.single .selectize-input {
  height: 31px;
  line-height: 26px;
  font-size: 14px ;
}
.pane-grid--body .selector .selectize-input input,
.pane-grid--body .selector .selectize-control.single .selectize-input input {
  height: 30px;
}
/* #endregion */
/*  #region  FINDER  */
.finder.default-top {
  margin-top: 5px;
}
.finder {
  /*margin-left: auto;
    margin-right: auto;*/
  padding-left: 63px;
}
.finder input,
.finder label,
.finder .clear {
  height: 40px;
}
.finder label,
.finder .clear {
  border: 1px solid #d8d8d8;
  line-height: 39px;
  transition: background-color 300ms ease;
}
.finder label {
  background-color: #f2f2f2;
  flex: 0 0 115px;
  font-size: 12pt;
  font-weight: 300;
  padding-left: 10px;
}
.finder label.selected {
  background-color: #0074d9;
  border: 1px solid #0074d9;
  color: white;
}
.finder label i {
  color: #aaa;
  padding-right: 4px;
}
.finder label.selected i {
  color: #ffffff;
}
.finder label + input,
.finder input + .clear {
  border-left: none;
}
.finder .clear {
  color: #888;
  cursor: pointer;
  flex: 0 0 40px;
  font-size: 8pt;
  text-align: center;
}
.finder .clear:hover {
  color: #111111;
}
.finder .clear:active {
  background-color: rgba(0, 116, 217, 0.3333);
}
.finder .commands {
  margin-top: 25px;
}
.finder .tag {
  margin-top: 25px;
}
/* --- FIND TASK RESULT MESSAGES --- */
.finder-msg {
  font-size: 16px;
  font-weight: 300;
  margin: 5px 0 0 0;
}
.finder-msg i {
  margin-right: 5px;
}
.finder-msg--generic {
  color: #111111;
}
.finder-msg--no-plans-found {
  color: #ff4136;
}
.finder-msg--plans-found {
  color: #3d9970;
  padding: 0 25px;
}
.redo--search {
  border: none;
  color: #111111;
  height: 36px;
  transition: font-size 150ms ease;
}
.redo--search:hover,
.redo--search:focus {
  color: #0074d9;
  cursor: pointer;
}
/* #endregion */
/*  #region  BACK  */
.back,
.back--object,
.back--pane {
  color: #ccc;
  cursor: pointer;
}
.back,
.back--object {
  font-size: 28pt;
  height: 50px;
  left: 60px;
  position: absolute;
  top: 75px;
  width: 50px;
}
.back--object {
  top: 115px;
}
.sub-keys ~ .back--object {
  top: 165px;
}
.back--pane {
  -webkit-animation-duration: 750ms;
          animation-duration: 750ms;
  font-size: 24pt;
  margin-left: -15px;
}
.back:hover,
.back--object:hover,
.back--pane:hover {
  color: #333;
}
/* #endregion */
/*  #region  SCRIM  */
.shade-container {
  height: 100%;
  left: 50px;
  position: absolute;
  top: 25px;
  transition: all 125ms ease;
  width: 100%;
  z-index: 2000;
  -webkit-animation-duration: 225ms;
          animation-duration: 225ms;
}
.shade {
  background-color: #111111;
  opacity: 0.5;
  min-height: 1px;
  min-width: 1px;
  transition: all 125ms ease;
}
.shade--hint {
  bottom: 30px;
  color: #A9A9A9;
  font-size: 15pt;
  font-weight: 300;
  left: 10px;
  position: absolute;
}
/* #endregion */
/*  #region  TOPLINE  */
.topline {
  background-color: #f2f2f2;
  display: flex;
  flex-direction: row;
  height: 25px;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 5010;
}
.topline .logo,
.topline .path,
.topline .user {
  font-size: 9pt;
  height: 25px;
  line-height: 24px;
  z-index: auto;
}
.topline .logo {
  background-color: #ff4136;
  color: #ffffff;
  font-size: 8pt;
  text-align: center;
  max-width: 50px;
  min-width: 50px;
  z-index: 5001;
}
.topline .logo:hover {
  cursor: help;
}
.topline .path {
  max-width: 100%;
  padding: 0 6px;
  text-transform: uppercase;
}
.topline .reminder {
  display: none;
}
.topline .status {
  color: #595959;
  font-size: 8pt;
  height: 25px;
  line-height: 24px;
  max-width: 100%;
  padding: 0 6px;
  z-index: auto;
}
.topline .status .status-count {
  float: right;
  font-size: 11pt;
  padding-left: 3px;
  padding-right: 2px;
  cursor: pointer;
  background-color: #d8d8d8;
}
.topline .status .status-count.overdue {
  background-color: #FF4136;
  color: #FFF;
}
.topline .status .status-count:hover {
  background-color: #ff851b;
  color: #000;
}
.topline .status .status-count.whatsnew {
  /* Iteration period = 1sec
       * Iteration count = 10 times
       */
  -webkit-animation: whatsnew-anumation 1s 10;
  /* Safari 4+ */
  /* Fx 5+ */
  /* Opera 12+ */
  animation: whatsnew-anumation 1s 10;
  /* IE 10+, Fx 29+ */
}
@-webkit-keyframes whatsnew-anumation {
  0%,
  49% {
    background-color: #FFDC00;
    /* border: 1px solid black; */
  }
  50%,
  100% {
    background-color: #f2f2f2;
    /* border: 1px solid white; */
  }
}
.topline .user {
  cursor: pointer;
  max-width: 165px;
  min-width: 165px;
}
.topline .user span {
  padding-left: 6px;
}
.topline .user.closed {
  background: #d8d8d8 url(../img/icons/down.svg) 97% center no-repeat;
  background-size: 10px;
}
.topline .user.open {
  background: #d8d8d8 url(../img/icons/up.svg) 97% center no-repeat;
  background-size: 10px;
}
.topline .user:hover {
  background-color: #bfbfbf;
}
.topline.impersonating,
.topline.impersonating .user.closed,
.topline.impersonating .user.open {
  background-color: #b10dc9;
  color: #ffffff;
}
.topline.impersonating .reminder {
  background-color: #b10dc9;
  border-radius: 25px;
  color: white;
  display: block;
  font-size: 25px;
  height: 50px;
  left: 49vw;
  line-height: 40px;
  position: absolute;
  text-align: center;
  top: 0px;
  width: 50px;
}
/* #endregion */
nav.nav-path {
  display: grid;
  height: 25px;
  line-height: 24px;
  grid-template-columns: repeat(8, -webkit-max-content);
  grid-template-columns: repeat(8, max-content);
  grid-template-rows: 25px;
  padding: 0;
  margin: 0;
}
nav.nav-path * {
  background-color: #d8d8d8;
}
nav.nav-path .head {
  width: 8px;
}
nav.nav-path .sep {
  align-self: start;
  padding: 0 2px;
}
nav.nav-path .sep svg {
  fill: black;
  width: 12px;
  height: 22px;
  padding-bottom: 2px;
}
nav.nav-path .path-elem {
  color: #000000;
  display: block;
  font-size: 12px;
  height: 100%;
  text-decoration: none;
  text-transform: uppercase;
  transition: all 200ms ease-in-out;
  padding: 1px 8px 0 8px;
}
nav.nav-path div.path-elem {
  cursor: default;
}
nav.nav-path a:hover {
  background-color: #0074d9;
  color: #ffffff;
}
/*  #region  DROPDOWN  */
.dropdown {
  background-color: #ffffff;
  box-shadow: 2px 2px 3px 1px rgba(100, 100, 100, 0.75);
}
.dropdown ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.dropdown li {
  border-bottom: 1px solid #f2f2f2;
  font-size: 9.5pt;
  font-weight: 400;
  padding: 4px;
  transition: background-color 350ms ease, border 350ms ease, color 350ms ease;
}
.dropdown li span {
  padding-left: 15px;
}
.dropdown li:hover {
  background-color: #0074d9;
  color: #ffffff;
  cursor: pointer;
}
.dropdown li:last-child {
  border-bottom: none;
}
.dropdown--user {
  -webkit-animation-duration: 150ms;
          animation-duration: 150ms;
  height: auto;
  width: inherit;
}
.dropdown--user li {
  color: #111111 !important;
}
.dropdown--user li.account:hover,
.dropdown--user li.password:hover,
.dropdown--user li.logout:hover,
.dropdown--user li.self:hover {
  background-color: #0074d9;
  color: #ffffff !important;
  cursor: pointer;
}
.dropdown--row {
  -webkit-animation-duration: 150ms;
          animation-duration: 150ms;
  height: auto;
  width: 150px;
  position: absolute;
  right: 5px;
  top: -7px;
  z-index: 2000;
}
/* #endregion */
/*  #region  KEYS  */
.keys {
  background-color: white;
}
.keys,
.sub-keys {
  display: flex;
  flex-direction: row;
  margin-top: 25px;
  padding-left: 50px;
}
.keys .inline-edit,
.sub-keys .inline-edit {
  border: none;
  height: 24px;
  margin: 0;
  padding: 2px;
  width: 90%;
}
.keys .inline-edit.submit,
.sub-keys .inline-edit.submit {
  width: 70%;
}
.keys .key .inline-btn,
.sub-keys .key .inline-btn {
  position: absolute;
  bottom: 5px;
  right: 5px;
  display: inline-flex;
}
.keys .inline-edit:hover,
.sub-keys .inline-edit:hover {
  cursor: pointer;
}
.keys .inline-edit:active,
.sub-keys .inline-edit:active,
.keys .inline-edit:focus,
.sub-keys .inline-edit:focus {
  background-color: #FFFFE0;
}
.keys .key,
.sub-keys .key,
.keys .more-ids,
.sub-keys .more-ids {
  background-color: white;
  border: 1px solid #d8d8d8;
  height: 50px;
  padding: 4px;
  position: relative;
}
.keys .key .key--label,
.sub-keys .key .key--label,
.keys .more-ids .key--label,
.sub-keys .more-ids .key--label {
  color: #555;
  font-size: 9.67pt;
  left: 6px;
  position: absolute;
  top: 1px;
}
.keys .key .key--label span,
.sub-keys .key .key--label span,
.keys .more-ids .key--label span,
.sub-keys .more-ids .key--label span {
  /*padding-left: 2px;*/
  padding-left: 0px;
}
.keys .key .key--data,
.sub-keys .key .key--data,
.keys .more-ids .key--data,
.sub-keys .more-ids .key--data {
  bottom: 5px;
  cursor: default;
  /*left: 15px;*/
  left: 5px;
  position: absolute;
  width: 90%;
}
.keys .key--data.submit,
.sub-keys .key--data.submit {
  width: 70%;
}
.keys .key .key--data,
.sub-keys .key .key--data,
.keys .more-ids .key--data,
.sub-keys .more-ids .key--data,
.keys .key .key--label,
.sub-keys .key .key--label,
.keys .more-ids .key--label,
.sub-keys .more-ids .key--label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.keys .key input.key--data.unit--revision,
.sub-keys .key input.key--data.unit--revision,
.keys .more-ids input.key--data.unit--revision,
.sub-keys .more-ids input.key--data.unit--revision {
  width: 40px;
  text-align: center;
}
.keys .key:first-child,
.sub-keys .key:first-child,
.keys .key + .key,
.sub-keys .key + .key,
.keys .key + .more-ids,
.sub-keys .key + .more-ids {
  border-left: none;
}
.keys .more-ids,
.sub-keys .more-ids {
  font-size: 11pt;
  font-weight: 300;
  max-width: 55px;
  min-width: 55px;
  text-align: center;
  text-transform: uppercase;
}
.keys .more-ids:hover,
.sub-keys .more-ids:hover {
  cursor: pointer;
  background-color: #0074d9;
  color: #ffffff;
  transition: background-color 400ms ease, border 400ms ease, color 500ms ease;
}
.keys.trimmed .key {
  border-bottom: 0;
}
.key.status .key--data {
  text-align: center;
  text-transform: uppercase;
}
.key.status--ok .key--data,
.key.status--low .key--data {
  color: #3D9970;
}
.key.status--na .key--data {
  color: gray;
}
.key.status--error .key--data,
.key.status--high .key--data {
  color: #FF4136;
}
.key.status--medium .key--data {
  color: #111111;
  background-color: #FFDC00;
  width: 85%;
}
.key.status--warning .key--data {
  color: #FF7700;
}
.key.status .key--data {
  text-align: center;
  text-transform: uppercase;
}
.key.green .key--data {
  color: green;
}
.key.red .key--data {
  color: red;
}
.key.ver-status {
  border-right: 0;
  max-width: 110px;
  width: 110px;
}
.key.ver-status .key--data,
.key.ver-num .key--data {
  text-transform: uppercase;
  text-overflow: unset;
}
.key.status-icon {
  align-items: end;
  border-left: 0;
  display: grid;
  max-width: 35px;
  width: 35px;
}
.key.ver-status.pending,
.key.ver-num.pending {
  background-color: #FFDC00;
}
.key.ver-status.pending .key--data,
.key.ver-num.pending .key--data {
  font-size: 21px;
  font-weight: bold;
  line-height: 21px;
}
.key.ver-status.draft,
.key.ver-num.draft {
  background-color: #FF851B;
}
.key.ver-status.draft .key--data,
.key.ver-num.draft .key--data,
.key.ver-status.draft .key--label,
.key.ver-num.draft .key--label {
  color: #FFFFFF;
}
.key.ver-status.draft .key--data,
.key.ver-num.draft .key--data {
  font-size: 21px;
  font-weight: bold;
  line-height: 21px;
}
.key.ver-status.obsolete,
.key.ver-num.obsolete,
.key.ver-status.inactive,
.key.ver-num.inactive {
  background-color: #323232;
}
.key.ver-status.obsolete .key--data,
.key.ver-num.obsolete .key--data,
.key.ver-status.inactive .key--data,
.key.ver-num.inactive .key--data,
.key.ver-status.obsolete .key--label,
.key.ver-num.obsolete .key--label,
.key.ver-status.inactive .key--label,
.key.ver-num.inactive .key--label {
  color: #FFFFFF;
  font-weight: normal;
}
.key.status-icon.released .key--data,
.key.ver-status.released .key--data,
.key.ver-num.released .key--data,
.key.status-icon.released .key--label,
.key.ver-status.released .key--label,
.key.ver-num.released .key--label {
  font-weight: normal;
}
.keys:has(.key.ver-status.draft) .key {
  border-bottom: 2px solid #FF851B;
}
.keys:has(.key.ver-status.pending) .key {
  border-bottom: 2px solid #FFDC00;
}
.keys:has(.key.ver-status.obsolete) .key {
  border-bottom: 2px solid #323232;
}
.keys:has(.key.ver-status.inactive) .key {
  border-bottom: 2px solid red;
}
.key.status-icon.released {
  background: url('../img/icons/status_released.svg') center 23px no-repeat;
}
.key.status-icon.draft {
  background: #FF851B url('../img/icons/status_draft.svg') center 18px no-repeat;
}
.key.status-icon.pending {
  background: #FFDC00 url('../img/icons/status_pending.svg') center 20px no-repeat;
}
.key.status-icon.pending.approved {
  background: #FFDC00 url('../img/icons/status_approved.svg') center 20px no-repeat;
}
.key.status-icon.pending.rejected {
  background: #FFDC00 url('../img/icons/status_rejected.svg') center 20px no-repeat;
}
.key.status-icon.obsolete {
  background: #323232 url('../img/icons/status_obsolete.svg') center 18px no-repeat;
}
.key.status-icon.inactive {
  background: #323232 url('../img/icons/status_inactive.svg') center 18px no-repeat;
}
.sub-keys {
  margin-top: 0px;
}
.sub-keys-border-bottom {
  border-bottom: 1px solid #D8D8D8;
}
.sub-keys .key {
  background-color: rgba(216, 216, 216, 0.55);
  border-top: none;
}
.sub-keys.ide .key {
  border-bottom: none;
}
.sub-keys .key.unit-number {
  flex: 0 0 200px;
}
.sub-keys .key.unit-number span.total {
  color: #9D9D9D;
  padding-left: 3px;
}
.sub-keys .key.serial-number {
  flex: 0 0 200px;
}
.sub-keys .key.specification-composite {
  min-width: 300px;
  max-width: 800px;
}
.sub-keys .key.pagination {
  min-width: 214px;
}
.sub-keys .pager-group .counts {
  line-height: 43px;
}
.sub-keys .sub-key--object {
  color: #ff4136;
  flex: 0 0 82px;
  font-size: 18pt;
  font-weight: 300;
  line-height: 49px;
  text-align: center;
  text-transform: uppercase;
}
.sub-keys .work-instructions,
.sub-keys .no-work-instructions {
  border: none;
  border-radius: 2px;
  height: 36px;
  width: 36px;
}
.keys-status,
.sub-keys-status {
  padding-left: 50px;
}
.keys-status .data-filters,
.sub-keys-status .data-filters {
  max-width: 100%;
  padding: 0 12px;
  font-size: 15pt;
  height: 25px;
  line-height: 25px;
}
.keys-status .data-filters .label,
.sub-keys-status .data-filters .label {
  margin-right: 6px;
}
.keys-status .data-filters .active,
.sub-keys-status .data-filters .active {
  color: #0074d9;
}
.keys-status {
  border-bottom: 1px solid #D8D8D8;
}
.sub-keys-status {
  border-top: 1px solid #D8D8D8;
}
/* #endregion */
/*  #region  COMMAND BAR  */
.command-bar {
  background-color: #222222;
  display: block;
  height: 100vh;
  padding-top: 25px;
  position: absolute;
  top: 0;
  width: 50px;
  z-index: 5000;
}
.command-bar ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.command-bar ul.alt-commands {
  margin-top: 30px;
}
.command-bar .command {
  border: 0;
  height: 60px;
  margin: 0;
  padding: 8px 0 0 0;
  position: relative;
  text-align: center;
  transition: background-color 400ms ease, border 400ms ease, color 500ms ease;
  width: 50px;
}
.command-bar .command .count {
  align-items: center;
  background-color: #ff4136;
  border-radius: 8px;
  color: white;
  display: grid;
  font-size: 9px;
  font-weight: 700;
  height: 18px;
  justify-items: center;
  position: absolute;
  right: 3px;
  text-align: center;
  top: 5px;
  width: 19px;
}
.command-bar .command .command--icon {
  font-size: 18pt;
  padding: 3px 0 0 0;
  transition: background-color 400ms ease, border 400ms ease, color 500ms ease, fill 500ms ease;
}
.command-bar .command .command--icon img {
  width: 27px;
}
.command-bar .command .command--icon svg {
  width: 27px;
  height: 27px;
  transition: fill 500ms ease;
}
.command-bar .command .command--icon svg path {
  transition: fill 500ms ease;
}
.command-bar .command .command--icon.command--text {
  margin-top: -4px;
  padding: 0 !important;
  text-transform: uppercase;
}
.command-bar .command .command--icon.command--text span.super {
  font-size: 9pt;
  vertical-align: super;
}
.command-bar .command .command--label {
  font-size: 9px;
  margin: 0;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  transition: background-color 400ms ease, border 400ms ease, color 500ms ease;
  width: 50px;
}
.command-bar .command .command--label.long {
  font-size: 8px;
}
.command-bar .command.separated {
  border-bottom: 1px solid #454545;
}
.command-bar .command.compressed,
.command-bar .command.ide {
  height: 50px;
  padding: 5px 0 0 0;
}
.command-bar .command:hover {
  /*background-color: #555555;*/
  cursor: pointer;
}
.command-bar .command.command_url,
.command-bar .command.command_id,
.command-bar .command.command_download {
  /*color: #ABABAB;*/
  color: #BBBBBB;
}
.command-bar .command.command_url:hover,
.command-bar .command.command_id:hover,
.command-bar .command.command_download:hover {
  color: #FFFFFF;
  background-color: #555555;
}
.command-bar .command.command_action.selected,
.command-bar .command.command_url.selected {
  color: #ffe13f;
}
.command-bar .command.command_action.selected svg,
.command-bar .command.command_url.selected svg {
  fill: #ffe13f;
}
.command-bar .command.command_action.selected svg path,
.command-bar .command.command_url.selected svg path {
  fill: #ffe13f;
}
.command-bar .command.command_url.disabled,
.command-bar .command.command_download.disabled {
  color: #555555;
}
.command-bar .command.command_url.disabled :hover,
.command-bar .command.command_download.disabled :hover {
  cursor: not-allowed;
}
.command-bar .command.command_download.waiting {
  color: #555555;
}
.command-bar .command.command_download.waiting :hover {
  cursor: progress;
}
.command-bar .command.command_action {
  color: #FFFFFF;
  background-color: #555555;
}
.command-bar .command.command_action:hover {
  background-color: #0074d9;
}
.command-bar .command.command_action.disabled:hover {
  background-color: #555555;
  cursor: not-allowed;
}
.command-bar .command.command_action.ver {
  color: #2ecc40;
}
.command-bar .command.command_action.msg {
  color: #FF851B;
}
.command-bar .command.command_action.disabled {
  color: #999999;
}
.command-bar .command.command_action.red {
  color: #FF4136;
}
.command-bar .command.command_action.red {
  color: #FF4136;
}
.command-bar .spacer {
  height: 20px;
  width: 50px;
}
/* #endregion */
/*  #region  FEATURE  */
.title,
.title--object,
.subtitle,
.features,
.filters {
  font-weight: 300;
  padding-left: 120px;
}
.pane-container .features {
  padding-left: 55px;
}
.filters.inline {
  padding-left: 20px;
  margin: 0 0 0 0;
}
.title,
.title--object {
  font-size: 40px;
  height: 55px;
  line-height: 48px;
  margin-top: 75px;
}
.title--object {
  margin-top: 40px;
}
.title.title--document {
  margin-top: 5px;
}
.warning--object + .title--object {
  margin-top: 6px;
}
.warning--object {
  padding-left: 120px;
  text-align: center;
  line-height: 18px;
  margin-top: 12px;
  font-size: 24px;
  color: #FF7700;
}
.warning--object:before {
  content: "\f063";
  font: normal normal normal 14px/1 "Black Tie";
  display: inline-block;
  font-size: inherit;
  vertical-align: -15.28571429%;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  margin-right: 5px;
}
.capa-features,
.subtitle,
.features,
.filters {
  font-size: 20px;
  margin: 4px 0 0 0;
}
.filters {
  font-size: 17px;
}
.feature-group,
.filter-group {
  position: relative;
}
.feature-group i.kbd,
.filter-group i.kbd {
  border-bottom: 1px solid #ccc;
  font-style: normal;
}
.feature,
.filter {
  border: 2px solid #ffffff;
  height: 40px;
  line-height: 35px;
  margin-left: 10px;
  padding: 0px 8px;
  transition: background-color 250ms ease;
  width: auto;
}
.feature.disabled {
  color: #a0a0a0;
}
.feature.warning {
  color: #FF7700;
  background-color: #fff8d0;
}
.feature.warning:before {
  content: "*";
}
.tab-warning-note {
  padding-left: 120px;
  margin-top: 10px;
  color: #FF7700;
}
.feature i.kbd,
.filter i.kbd {
  border-bottom: 1px solid #ccc;
  font-style: normal;
}
.feature .doc-count,
.filter .doc-count {
  color: #0074d9;
}
.feature:hover,
.filter:hover {
  background-color: #d8d8d8;
  border: 2px solid #d8d8d8;
  cursor: pointer;
}
.feature.selected,
.filter.selected {
  background-color: #0074d9;
  border: 2px solid #0074d9;
  color: #ffffff;
  cursor: pointer;
}
.feature.selected .doc-count {
  color: #ffffff;
}
.feature:first-child,
.filter:first-child {
  margin-left: 0;
}
.icon--new-object,
.icon--search,
.icon--new-object-disabled {
  height: 40px;
  line-height: 39px;
  padding: 0 4px;
  width: auto;
}
.icon--new-object {
  border: 2px solid #3d9970;
  background-color: #3d9970;
  color: #ffffff;
}
.icon--new-object-disabled {
  border: 2px solid #AAAAAA;
  background-color: #AAAAAA;
  color: #ffffff;
}
.feature.new-object {
  border: 2px solid #3d9970;
  border-left: none;
  color: #3d9970;
  margin-left: 0;
  padding: 0px 6px;
}
.feature.new-object i.kbd {
  border-color: #3d9970;
}
.feature.new-object-disabled {
  border: 2px solid #AAAAAA;
  border-left: none;
  color: #AAAAAA;
  margin-left: 0;
  padding: 0px 6px;
  cursor: not-allowed;
}
.feature.new-object-disabled i.kbd {
  border-color: #AAAAAA;
}
.feature.new-object-disabled:hover,
.feature.new-object-disabled.selected,
.feature.new-object-disabled.selected:hover,
.feature.new-object-disabled.selected:active {
  background-color: #ffffff;
  color: #AAAAAA;
}
.feature.new-object:hover,
.feature.new-object.selected,
.feature.new-object.selected:hover,
.feature.new-object.selected:active {
  background-color: #3d9970;
  color: #ffffff;
}
.sort-by.label {
  font-size: 13pt;
  font-weight: 300;
  margin-right: 10px;
  height: 40px;
  line-height: 39px;
}
/* #endregion */
/*  #region  SEARCH  */
.icon--search {
  background-color: #f2f2f2;
  border: 1px solid #d8d8d8;
  color: #111111;
  max-width: 30px;
  min-width: 30px;
  text-align: center;
}
.icon--search:hover {
  background-color: #bfbfbf;
  cursor: pointer;
}
input + .icon--search {
  border-left: none;
}
.search-container {
  max-width: 45%;
  min-width: 20%;
}
.search-container .search-group {
  width: 100%;
}
.search-container .input--search {
  border: 1px solid #d8d8d8;
  height: 40px;
}
.icon--search.active {
  background-color: #0074d9;
  color: white;
}
.icon--search.disabled,
.icon--search.disabled:hover {
  background-color: #f2f2f2;
  color: #c0c0c0;
  cursor: default;
}
/* #endregion */
/*  #region  HUBS, TILES   */
.hub {
  /*margin-top: 25px;*/
  margin-left: 120px;
  padding-bottom: 25px;
}
.hub .tile {
  color: #ffffff;
  cursor: pointer;
  font-size: 22pt;
  font-weight: 300;
  height: 192px;
  line-height: 1.1em;
  margin-right: 28px;
  margin-top: 25px;
  padding-top: 40px;
  position: relative;
  transition: all 200ms ease;
  width: 183px;
}
.hub .tile i,
.hub .tile div {
  position: absolute;
}
.hub .tile i {
  bottom: 15px;
  right: 4px;
}
.hub .tile div {
  top: 10px;
  left: 15px;
}
.hub .tile.scratch {
  background-color: #39CCCC;
  border: 8px solid #39CCCC;
}
.hub .tile.datafile {
  background-color: #014421;
  border: 8px solid #014421;
}
.hub .tile.drawing {
  background-color: #3D9970;
  border: 8px solid #3D9970;
}
.hub .tile.newrev {
  background-color: #2ECC40;
  border: 8px solid #2ECC40;
}
.hub .tile.clone {
  background-color: #aaaaaa;
  border: 8px solid #aaaaaa;
  color: #dddddd;
}
.hub .tile.customer {
  background-color: #b8860b;
  border: 8px solid #b8860b;
}
.hub .tile.cmm {
  background-color: #85144B;
  border: 8px solid #85144B;
}
.hub .tile.scratch.selected,
.hub .tile.datafile.selected,
.hub .tile.drawing.selected,
.hub .tile.newrev.selected,
.hub .tile.clone.selected,
.hub .tile.customer.selected,
.hub .tile.cmm.selected {
  border: 8px solid #0074d9;
}
/* #endregion */
/*  #region  SLIDEOUTS  */
.pane-container {
  -webkit-animation-duration: 250ms;
          animation-duration: 250ms;
  background-color: white;
  height: 100%;
  position: absolute;
  right: 0;
  top: 25px;
  transition: all 200ms ease;
  width: 50%;
  z-index: 2500;
}
.pane-container .reference-id {
  background-color: #ececec;
  border-radius: 30px;
  color: #909090;
  font-size: 10px;
  padding: 4px 12px;
  position: absolute;
  right: 16px;
  text-align: center;
  top: 16px;
  width: auto;
}
.pane-container .guidance {
  color: #01ff70;
  font-weight: 500;
}
.pane-container .pane-commands,
.pane-container .pane-instructions,
.pane-container .pane-identifiers {
  padding-left: 63px;
}
.pane-container .pane-identifiers label,
.pane-container .pane-identifiers input {
  margin-bottom: 5px;
}
.pane-container .pane-identifiers label.block {
  display: block;
}
.pane-container .pane-identifiers label.light-weight {
  font-weight: 300;
}
.pane-container .pane-identifiers label.note {
  font-weight: 300;
  color: #0074d9;
}
.pane-container .pane-identifiers .status-info {
  margin-top: -10px;
  margin-bottom: 15px;
  margin-right: 15px;
  text-align: right;
  font-style: italic;
  font-size: 15px;
}
.pane-container .pane-instructions {
  margin-bottom: 20px;
  margin-right: 15px;
}
.pane-container .pane-title {
  font-size: 24pt;
  margin-top: 25px;
  margin-left: 25px;
}
.pane-container .sub-heading {
  font-weight: bold;
}
.pane-container .pane-leadline {
  margin-bottom: 25px;
}
.pane-container--one-third {
  width: 33%;
}
.pane-container--two-thirds {
  width: 67%;
}
.pane-container--three-quarters {
  width: 75%;
}
.pane-container--four-fifths {
  width: 80%;
}
.pane-container--nine-tenths {
  width: 90%;
}
.list-controls {
  margin-top: 5px;
  margin-bottom: 5px;
}
.pane-container .command--icon {
  font-size: 18pt;
  padding: 3px 0 0 0;
  transition: background-color 400ms ease, border 400ms ease, color 500ms ease, fill 500ms ease;
  display: inline-block;
}
.pane-container .command--icon img {
  width: 27px;
}
.pane-container .command--icon svg {
  width: 27px;
  height: 27px;
  transition: fill 500ms ease;
}
.pane-container .command--icon svg path {
  transition: fill 500ms ease;
}
.pane-container .command--icon.disabled {
  color: #d8d8d8;
}
.pane-container .command--icon:hover {
  cursor: pointer;
  text-shadow: 1px 1px 1px #888888;
}
.pane-container .command--icon.disabled:hover {
  cursor: not-allowed;
  text-shadow: none;
}
.pane-container .command--label {
  margin-left: 10px;
  font-weight: 300;
  color: #555;
  font-style: italic;
}
.dropZone {
  border: 5px dashed darkgray;
  height: 100px;
  margin-bottom: 20px;
  text-align: center;
  align-content: center;
  font-size: larger;
  color: darkgray;
}
.dropZone.dropAreaGood {
  border: 5px solid green;
  background-color: #f0fff0;
  color: black;
}
.dropZone.dropAreaBad {
  border: 5px solid red;
  background-color: #fff0f0;
  color: black;
}
video.dropAreaGood,
img.dropAreaGood {
  outline: 5px dashed green;
  outline-offset: -5px;
}
video.dropAreaBad,
img.dropAreaBad {
  outline: 5px dashed red;
  outline-offset: -5px;
}
.pane-container .pane-tab {
  height: 100%;
}
.warning-msg {
  background: transparent url(../img/icons/warning-orange.svg) no-repeat left 0px center;
  background-size: 16px;
  color: #FF7700;
  padding-left: 18px;
  margin-bottom: 5px;
}
.info-msg {
  color: #0074d9;
  margin-bottom: 5px;
}
.info-msg p {
  margin-left: 22px;
  margin-block: unset;
}
.info-msg:before {
  content: "\f02b";
  font: normal normal normal 14px/1 "Black Tie";
  display: inline-block;
  font-size: inherit;
  vertical-align: -14.28571429%;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  margin-right: 5px;
}
.app-container > .info-msg {
  margin-left: 120px;
}
.wait-msg {
  color: #0074d9;
  margin-bottom: 5px;
}
.wait-msg:before {
  content: "\f03D";
  font: normal normal normal 14px/1 "Black Tie";
  display: inline-block;
  font-size: inherit;
  vertical-align: -14.28571429%;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  margin-right: 5px;
  -webkit-animation: bt-spin 2s infinite linear;
          animation: bt-spin 2s infinite linear;
}
.upload-msg {
  color: #0074d9;
  margin-bottom: 5px;
}
.upload-msg:before {
  content: "\f055";
  font: normal normal normal 14px/1 "Black Tie";
  display: inline-block;
  font-size: inherit;
  vertical-align: -14.28571429%;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  margin-right: 5px;
}
.complete-msg {
  color: #0e8606;
  margin-bottom: 5px;
}
.complete-msg:before {
  content: "\f013";
  font: normal normal normal 14px/1 "Black Tie";
  display: inline-block;
  font-size: inherit;
  vertical-align: -14.28571429%;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  margin-right: 5px;
}
.topline .info-msg,
.topline .ok-msg,
.topline .warning-msg {
  font-size: 9pt;
  line-height: 24px;
}
.ok-msg {
  color: #3D9970;
  margin-bottom: 5px;
}
.ok-msg:before {
  content: "\f013";
  font: normal normal normal 14px/1 "Black Tie";
  display: inline-block;
  font-size: inherit;
  vertical-align: -14.28571429%;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  margin-right: 5px;
}
/*.pane-container--specification {
   width: 75%;
 }*/
/* #endregion */
/*  #region  PAGINATION  */
.pager-group {
  /*margin-left: 10px;*/
  min-width: 195px;
  max-width: 195px;
}
.pager-group.comp-insp {
  min-width: 120px;
  max-width: 120px;
}
.pager-group .counts {
  flex: 0 0 auto;
  font-size: 11pt;
  font-weight: 600;
  line-height: 39px;
  margin-left: 5px;
  margin-right: 10px;
}
.pager-group span {
  font-weight: 300;
  padding: 0 4px;
}
.pager {
  border: 1px solid #d8d8d8;
  border-right: none;
  font-size: 7pt;
  height: 40px;
  line-height: 39px;
  text-align: center;
  transition: background-color 350ms ease, border 350ms ease, color 350ms ease;
  width: 30px;
}
.pager:last-child {
  border-right: 1px solid #d8d8d8;
}
.pager.current,
.pager.current:hover {
  background-color: #0074d9;
  border: 1px solid #0074d9;
  color: white;
  font-size: 12pt;
  font-weight: 300;
}
.pager:hover {
  background-color: #d8d8d8;
  cursor: pointer;
}
/* #endregion */
/*  #region  GRID  */
.pane-grid {
  margin-left: auto;
  margin-right: auto;
}
.pane-grid.scroll-y {
  overflow-x: hidden;
  overflow-y: scroll;
}
.enterprise-grid--headings,
.enterprise-grid--body,
.enterprise-grid--footings,
.pane-grid--headings,
.pane-grid--body,
.pane-grid--footings {
  padding-left: 0px;
}
.enterprise-grid--headings,
.pane-grid--headings {
  margin: 5px 0 0 0;
  height: 30px;
}
.pane-grid--headings {
  margin-top: 0;
}
.enterprise-grid--headings .row {
  position: relative;
}
.enterprise-grid--headings .row .filterlist {
  background-color: #FFFFFF;
  border: 2px solid #324324;
  /*height: 150px;
      height: auto;*/
  line-height: 14px;
  min-height: 50px;
  max-height: 180px;
  padding: 0;
  position: absolute;
  top: 30px;
  z-index: 10;
}
.enterprise-grid--headings .row .filterlist .filtervalues {
  position: relative;
  /*height: 130px;*/
  height: auto;
  min-height: 30px;
  max-height: 130px;
}
.enterprise-grid--headings .row .filterlist div {
  padding: 2px;
  padding-bottom: 3px;
  /*width: 100%;*/
}
.enterprise-grid--headings .row .filterlist div.flex-set,
.enterprise-grid--headings .row .filterlist div.text,
.enterprise-grid--headings .row .filterlist div.close {
  cursor: default;
  background-color: #333;
  color: #FFFFFF;
}
.enterprise-grid--headings .row .filterlist div.close {
  background: transparent url(../img/icons/funnel-base.svg ) no-repeat center center;
  background-size: 13px 13px;
  padding: 0 4px 0 0;
  padding-top: 1px;
  flex: 0 0 10%;
  text-align: center;
}
.enterprise-grid--headings .row .filterlist div.close:hover {
  background: #ff4136 url(../img/icons/funnel.svg ) no-repeat center center;
  background-size: 13px 13px;
  cursor: pointer;
}
.enterprise-grid--headings .row .filtervalue.selected {
  background-color: rgba(0, 116, 217, 0.33);
}
.enterprise-grid--headings .row .filtervalue:hover {
  background-color: #0074d9;
  color: white;
  cursor: pointer;
}
.enterprise-grid--headings .cell.filterable.heading {
  padding-left: 0;
  padding-right: 0;
}
.enterprise-grid--headings .cell.filterable.heading span {
  padding-left: 3px;
  padding-right: 3px;
}
.enterprise-grid--body,
.pane-grid--body {
  max-height: 480px;
}
.enterprise-grid--body {
  min-height: 240px;
  /*120px;*/
}
.enterprise-grid--body.inline {
  min-height: unset;
  max-height: 285px;
}
.pane-grid--body.speclib-usage {
  max-height: 420px;
}
.pane-grid--body.shorter {
  max-height: 380px;
}
.enterprise-grid--body.scrollable,
.pane-grid--body.scrollable {
  overflow-y: scroll;
  scrollbar-width: none;
}
.pane-grid--body {
  min-height: auto;
}
.enterprise--grid--footings,
.pane-grid--footings {
  margin-bottom: 30px;
}
.enterprise-grid .ascending,
.pane-grid .ascending {
  background: transparent url(../img/svg/sort_asc.svg) 99% center no-repeat;
  background-size: 15px;
}
.enterprise-grid .descending,
.pane-grid .descending {
  background: transparent url(../img/svg/sort_desc.svg) 99% center no-repeat;
  background-size: 15px;
}
.enterprise-grid .row,
.pane-grid .row {
  display: flex;
  flex-direction: row;
  position: relative;
  transition: background-color 200ms ease;
}
.enterprise-grid .row:nth-child(even),
.pane-grid .row:nth-child(even) {
  background-color: rgba(240, 255, 255, 0.67);
}
.enterprise-grid .cell.heading:hover,
.pane-grid .cell.heading:hover,
.enterprise-grid .row:hover,
.pane-grid .row:hover {
  cursor: pointer;
  background-color: #ff8b26;
}
.enterprise-grid .cell.heading:hover .disabled,
.pane-grid .cell.heading:hover .disabled,
.enterprise-grid .row:hover .disabled,
.pane-grid .row:hover .disabled {
  cursor: not-allowed;
}
.enterprise-grid .cell,
.pane-grid .cell {
  flex: auto;
}
.enterprise-grid .data,
.pane-grid .data,
.enterprise-grid .heading,
.pane-grid .heading,
.enterprise-grid .heading.commands,
.pane-grid .heading.commands {
  background-color: #d8d8d8;
  border: 1px solid #d8d8d8;
  font-size: 14px;
  font-weight: 300;
  height: 30px;
  line-height: 29px;
  overflow: hidden;
  padding: 0 3px;
  text-overflow: ellipsis;
  transition: background-color 250ms ease;
  white-space: nowrap;
}
.enterprise-grid .heading,
.pane-grid .heading,
.enterprise-grid .heading.commands,
.pane-grid .heading.commands {
  border: 1px solid #bfbfbf;
  font-size: 9.5pt;
  font-weight: 400;
}
.enterprise-grid .heading:first-child,
.pane-grid .heading:first-child,
.enterprise-grid .heading + .heading,
.pane-grid .heading + .heading {
  border-right: 0;
}
.enterprise-grid .heading:last-child,
.pane-grid .heading:last-child {
  border: 1px solid #bfbfbf;
}
.enterprise-grid .heading.commands,
.pane-grid .heading.commands {
  background: #d8d8d8 url(../img/icons/ellipsis.svg) center center no-repeat;
  background-size: 10px;
}
.enterprise-grid .heading.commands,
.pane-grid .heading.commands {
  min-width: 30px;
  max-width: 30px;
}
.enterprise-grid .heading.blunt,
.pane-grid .heading.blunt {
  flex: 0 0 15px;
}
.enterprise-grid .data,
.pane-grid .data {
  background-color: transparent;
  border: 1px solid #d1d1d1;
  border-top: 0;
  font-weight: 400;
}
.enterprise-grid .data:first-child,
.pane-grid .data:first-child,
.enterprise-grid .data + .data,
.pane-grid .data + .data {
  border-right: 0;
}
.enterprise-grid .data:last-child,
.pane-grid .data:last-child {
  border-right: 1px solid #d1d1d1;
}
.enterprise-grid .data.commands,
.pane-grid .data.commands {
  max-width: 30px;
}
.enterprise-grid .data.commands,
.pane-grid .data.commands {
  background: transparent url(../img/icons/ellipsis.svg) center center no-repeat;
  background-size: 10px;
}
.enterprise-grid .data.commands:hover,
.pane-grid .data.commands:hover {
  background: #9e4900 url(../img/icons/ellipsis_white.svg) center center no-repeat;
  background-size: 10px;
  border: 1px solid #9e4900;
}
.enterprise-grid .cell.heading,
.pane-grid .cell.heading,
.enterprise-grid .cell.data,
.pane-grid .cell.data {
  flex: 0 0 10%;
}
.enterprise-grid .cell.heading.progress.small {
  flex: 0 0 5%;
}
.enterprise-grid .cell.heading.centered,
.pane-grid .cell.heading.centered,
.enterprise-grid .cell.data.centered,
.pane-grid .cell.data.centered {
  text-align: center;
}
.enterprise-grid .cell.heading.double,
.pane-grid .cell.heading.double,
.enterprise-grid .cell.data.double,
.pane-grid .cell.data.double {
  flex: 0 0 20%;
}
.enterprise-grid .cell.heading.flex,
.pane-grid .cell.heading.flex,
.enterprise-grid .cell.data.flex,
.pane-grid .cell.data.flex {
  flex: auto;
}
.enterprise-grid .cell.heading.mediumlong,
.pane-grid .cell.heading.mediumlong,
.enterprise-grid .cell.data.mediumlong,
.pane-grid .cell.data.mediumlong {
  flex: 0 0 100px;
}
.enterprise-grid .cell.heading.mediumlong2,
.pane-grid .cell.heading.mediumlong2,
.enterprise-grid .cell.data.mediumlong2,
.pane-grid .cell.data.mediumlong2 {
  flex: 0 0 120px;
}
.enterprise-grid .cell.heading.long,
.pane-grid .cell.heading.long,
.enterprise-grid .cell.data.long,
.pane-grid .cell.data.long {
  flex: 0 0 200px;
}
.enterprise-grid .cell.heading.long2,
.pane-grid .cell.heading.long2,
.enterprise-grid .cell.data.long2,
.pane-grid .cell.data.long2 {
  flex: 0 0 230px;
}
.enterprise-grid .cell.heading.doublelong,
.pane-grid .cell.heading.doublelong,
.enterprise-grid .cell.data.doublelong,
.pane-grid .cell.data.doublelong {
  flex: 0 0 400px;
}
.enterprise-grid .cell.heading.medium,
.pane-grid .cell.heading.medium,
.enterprise-grid .cell.data.medium,
.pane-grid .cell.data.medium {
  flex: 0 0 80px;
}
.enterprise-grid .cell.heading.medshort,
.pane-grid .cell.heading.medshort,
.enterprise-grid .cell.data.medshort,
.pane-grid .cell.data.medshort {
  flex: 0 0 60px;
}
.enterprise-grid .cell.heading.short,
.pane-grid .cell.heading.short,
.enterprise-grid .cell.data.short,
.pane-grid .cell.data.short {
  flex: 0 0 50px;
}
.enterprise-grid .boolean,
.pane-grid .boolean {
  min-width: 65px;
  max-width: 65px;
  text-align: center;
}
.enterprise-grid .centered,
.pane-grid .centered {
  text-align: center;
}
.enterprise-grid .date,
.pane-grid .date {
  min-width: 90px;
  max-width: 90px;
  text-align: center;
}
.pane-grid .data.selector {
  overflow: visible;
  padding: 0;
}
.enterprise-grid .dnd-handle,
.pane-grid .dnd-handle {
  cursor: move;
  max-width: 20px;
  min-width: 20px;
}
.enterprise-grid .dnd-handle:after,
.pane-grid .dnd-handle:after {
  color: rgba(0, 116, 217, 0.5);
  content: '\2195';
  font-size: 13pt;
  line-height: 19px;
  padding-left: 2px;
}
.enterprise-grid .dnd-handle.heading:after,
.pane-grid .dnd-handle.heading:after {
  color: #111111;
}
.enterprise-grid .dnd-handle.heading,
.pane-grid .dnd-handle.heading {
  cursor: default;
}
.enterprise-grid .false,
.pane-grid .false,
.enterprise-grid .no,
.pane-grid .no {
  color: #4a4a4a;
  font-weight: 300;
  text-align: center;
}
.enterprise-grid .true,
.pane-grid .true,
.enterprise-grid .yes,
.pane-grid .yes {
  color: #000000;
  font-weight: 600;
  text-align: center;
}
/* added by oleg */
.enterprise-grid--body .cell span.rev {
  /*blue*/
  color: #0074d9;
  margin-left: 5px;
}
.enterprise-grid {
  margin-left: 120px;
}
.enterprise-grid,
.pane-grid,
.grid--matrix {
  /* from inspection */
  /* from inspection, capa */
}
.enterprise-grid .cell.data.risk--high,
.pane-grid .cell.data.risk--high,
.grid--matrix .cell.data.risk--high,
.enterprise-grid .cell.data.risk--low,
.pane-grid .cell.data.risk--low,
.grid--matrix .cell.data.risk--low,
.enterprise-grid .cell.data.risk--medium,
.pane-grid .cell.data.risk--medium,
.grid--matrix .cell.data.risk--medium,
.enterprise-grid .cell.data.risk--mediumhigh,
.pane-grid .cell.data.risk--mediumhigh,
.grid--matrix .cell.data.risk--mediumhigh,
.enterprise-grid .cell.data.risk--na,
.pane-grid .cell.data.risk--na,
.grid--matrix .cell.data.risk--na {
  color: #fff;
  text-transform: uppercase;
}
.enterprise-grid .cell.data.risk--high,
.pane-grid .cell.data.risk--high,
.grid--matrix .cell.data.risk--high {
  background-color: #FF4136;
}
.enterprise-grid .cell.data.risk--mediumhigh,
.pane-grid .cell.data.risk--mediumhigh,
.grid--matrix .cell.data.risk--mediumhigh {
  background-color: #FF851B;
}
.enterprise-grid .cell.data.risk--medium,
.pane-grid .cell.data.risk--medium,
.grid--matrix .cell.data.risk--medium {
  color: #111111;
  background-color: #FFDC00;
}
.enterprise-grid .cell.data.risk--low,
.pane-grid .cell.data.risk--low,
.grid--matrix .cell.data.risk--low {
  background-color: #3D9970;
}
.enterprise-grid .cell.data.risk--na,
.pane-grid .cell.data.risk--na,
.grid--matrix .cell.data.risk--na {
  /*background-color: transparent;*/
  background-color: gray;
}
.enterprise-grid .cpk.cpk--high,
.pane-grid .cpk.cpk--high,
.grid--matrix .cpk.cpk--high,
.enterprise-grid .ppk.ppk--high,
.pane-grid .ppk.ppk--high,
.grid--matrix .ppk.ppk--high {
  background-color: #3D9970;
  color: #ffffff;
}
.enterprise-grid .cpk.cpk--medium,
.pane-grid .cpk.cpk--medium,
.grid--matrix .cpk.cpk--medium,
.enterprise-grid .ppk.ppk--medium,
.pane-grid .ppk.ppk--medium,
.grid--matrix .ppk.ppk--medium {
  background-color: #FFDC00;
  color: #111111;
}
.enterprise-grid .cpk.cpk--low,
.pane-grid .cpk.cpk--low,
.grid--matrix .cpk.cpk--low,
.enterprise-grid .ppk.ppk--low,
.pane-grid .ppk.ppk--low,
.grid--matrix .ppk.ppk--low {
  background-color: #FF4136;
  color: #ffffff;
}
.enterprise-grid .data.progress,
.pane-grid .data.progress,
.grid--matrix .data.progress {
  background-color: #f2f2f2;
  display: flex;
  flex-direction: row;
  flex: 0 0 10%;
  margin: 0;
  padding: 0;
}
.enterprise-grid .data.progress .pass,
.pane-grid .data.progress .pass,
.grid--matrix .data.progress .pass {
  background-color: #3D9970;
}
.enterprise-grid .data.progress .fail,
.pane-grid .data.progress .fail,
.grid--matrix .data.progress .fail {
  background-color: #FF4136;
}
.enterprise-grid .data.progress .med,
.pane-grid .data.progress .med,
.grid--matrix .data.progress .med {
  background-color: #FFDC00;
}
.enterprise-grid .data.progress .unknown,
.pane-grid .data.progress .unknown,
.grid--matrix .data.progress .unknown {
  background-color: #aaa;
}
.enterprise-grid .data.progress .marker,
.pane-grid .data.progress .marker,
.grid--matrix .data.progress .marker {
  border-right-style: solid;
  border-right-width: 2px;
  box-sizing: border-box !important;
}
.enterprise-grid .data.progress.small,
.pane-grid .data.progress.small,
.grid--matrix .data.progress.small {
  flex: 0 0 5%;
}
.pane-grid .data.progress,
.pane-grid .heading.progress {
  flex: 0 0 20%;
}
/* #endregion */
.app-container .handsontable .risk--high,
.app-container .handsontable .risk--low,
.app-container .handsontable .risk--medium,
.app-container .handsontable .risk--mediumhigh,
.app-container .handsontable .risk--na {
  color: #fff;
  text-transform: uppercase;
}
.app-container .handsontable .risk--high {
  background-color: #FF4136;
}
.app-container .handsontable .risk--mediumhigh {
  background-color: #FF851B;
}
.app-container .handsontable .risk--medium {
  color: #111111;
  background-color: #FFDC00;
}
.app-container .handsontable .risk--low {
  background-color: #3D9970;
}
.app-container .handsontable .risk--na {
  /*background-color: transparent;*/
  background-color: gray;
}
/*  HANDSONTABLE OVERRIDES
 *  Excel tables:  presumes use of JavaScript Spreadsheet @https://handsontable.com/
 */
/*  #region  HANDSONTABLE  */
.handsontable {
  font-size: 14px;
  font-weight: 400;
  /* added by Oleg on 03/12/2019 */
}
.handsontable thead th {
  font-size: 10pt;
  height: 29px !important;
  /* important, otherwise matrix w/o s/n column row headers get messed up*/
  max-height: 29px;
}
.handsontable table tr,
.handsontable table th,
.handsontable table td {
  /*height: 29px !important; do not hard code height, otherwise traveler matrix with long batch numbers get messed up*/
  line-height: 29px;
}
.handsontable table,
.handsontable tbody,
.handsontable thead,
.handsontable td,
.handsontable th,
.handsontable input,
.handsontable textarea,
.handsontable div {
  box-sizing: content-box !important;
}
.handsontable th .rowHeader {
  font-size: 12px;
}
.handsontable thead th .relative {
  padding: 0;
  line-height: 29px;
}
.handsontable td.area,
.handsontable td.current.area {
  background-color: #ff851b !important;
}
.handsontable td.htDimmed {
  background-color: #F3F3F3;
  background-color: rgba(247, 247, 247, 0.7);
  cursor: not-allowed;
  color: #424242;
}
.handsontable tbody th.ht__highlight,
.handsontable thead th.ht__highlight {
  background-color: #DBD8D8;
  /* this is 1factory's default, HOT's is #DCDCDC */
}
.handsontable textarea.handsontableInput {
  max-height: 31px;
}
.handsontable .handsontableInput {
  line-height: 29px;
}
.handsontable .enterable {
  font-weight: 600;
}
.handsontable tbody tr td {
  height: 30px;
  line-height: 29px;
}
/* #endregion */
#js-plan-tos {
  /*.handsontable td.tos-tol {
    	background-color: rgba(0, 116, 217, .15);
    }*/
}
#js-plan-tos .colHeader {
  display: flex;
}
#js-plan-tos .colHeadRow {
  display: flex;
  width: 100%;
}
#js-plan-tos .spec-number {
  box-sizing: border-box !important;
  min-width: 35px;
  color: #FFF;
  background-color: #111;
  font-weight: 600;
  height: 35px;
  line-height: 34px;
  font-size: 13px;
}
#js-plan-tos .spec-type {
  box-sizing: border-box !important;
  min-width: 35px;
  color: #FFF;
  background-color: #999;
  font-weight: 600;
  height: 35px;
  line-height: 34px;
  font-size: 11px;
}
#js-plan-tos .tolerance {
  font-weight: 600;
  height: 35px;
  line-height: 34px;
  font-size: 12.25px;
  flex: 1 1 auto;
  padding-left: 5px;
  text-align: left;
  text-overflow: ellipsis;
  overflow: hidden;
  background-color: #FAFAFA;
  text-transform: uppercase;
}
#js-machine-table .handsontable td.htDimmed {
  background-color: #FFF;
  cursor: pointer;
}
/*  #region  COLLABORATION  */
.collaboration-activity {
  margin-left: -10px;
  transition: all 200ms ease;
}
.collaboration-activity:hover {
  cursor: pointer;
  font-size: 20pt;
  right: -20px;
  top: -14px;
}
/* #endregion */
/*  #region  UTILITY  */
.auto-margin {
  margin: 0 auto;
}
.caps {
  text-transform: uppercase;
}
.elipped {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.handsontable td.elip,
.elip {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.error {
  color: #ff4136;
}
.icon-host {
  text-align: center;
  line-height: 39px;
}
.input-small input {
  min-width: 50px;
}
.more--bottom {
  margin-bottom: 15px;
}
.more--bottom-2x {
  margin-bottom: 30px;
}
.more--left {
  margin-left: 15px;
}
.more--left-2x {
  margin-left: 30px;
}
.more--right {
  margin-right: 15px;
}
.more--right-pad {
  padding-right: 15px;
}
.more--right-2x {
  margin-right: 30px;
}
.more--right-2x-pad {
  padding-right: 30px;
}
.more--top {
  margin-top: 15px;
}
.more--top-2x {
  margin-top: 30px;
}
.less--bottom {
  margin-bottom: -15px;
}
.not-visible {
  visibility: hidden;
}
.scroll-y {
  overflow-x: hidden;
  overflow-y: auto;
}
/* used for linked NCRs and Task List / source */
.blue--link {
  color: #0074d9;
  text-decoration: underline;
  cursor: pointer;
}
.blue--link.disabled {
  color: #9D9D9D;
  text-decoration: none;
  cursor: not-allowed;
}
.warn--link {
  color: #FF7700;
  text-decoration: underline;
  cursor: pointer;
}
/* used for linked NCRs */
.input--links {
  width: 100%;
  height: 40px;
  background-color: #f0f8ff;
  border: 1px solid #dcdcdc;
  padding-top: 7px;
  padding-left: 5px;
}
.clickable:hover {
  cursor: pointer;
}
.progress-bar {
  width: 100%;
  height: 40px;
  border: 1px solid #d1d1d1;
  background-color: #f2f2f2;
}
.progress-bar .completed {
  width: 0;
  background-color: #3d9970;
  height: 100%;
}
/* HOT styling */
.hot--error {
  background: transparent url(../img/icons/warning2.svg) no-repeat right 10px center;
  background-size: 16px;
}
.hidden-jq {
  display: none;
}
.invisible {
  visibility: hidden;
}
/* #endregion */
/*   
 *   MEDIA QUERIES
 *
 *      MAX : @dimension is ( less than | equal to )    @value
 *      MIN : @dimension is ( greater than | equal to ) @value
 *    
 *      Target: topline objects and keys, if viewport is less-than 
 *        or equal to 1280, then set certain elements to smaller sizes 
 */
@media only screen and (max-height: 766px) {
  .enterprise-grid--body,
  .pane-grid--body {
    max-height: 450px;
  }
  .enterprise-grid--body.shorter {
    max-height: 320px;
  }
}
/*
If viewport height is between 767 and 901, then set available height ---------- */
@media only screen and (max-height: 900px) and (min-height: 767px) {
  .enterprise-grid--body,
  .pane-grid--body {
    max-height: 510px;
  }
  .enterprise-grid--body.shorter {
    max-height: 410px;
  }
}
/*
If viewport height is greater than or equal to 901, the set available height -- */
@media only screen and (max-height: 1000px) and (min-height: 901px) {
  .enterprise-grid--body,
  .pane-grid--body {
    max-height: 650px;
  }
  .enterprise-grid--body.shorter {
    max-height: 500px;
  }
}
/*
If viewport height is greater than or equal to 901, the set available height -- */
@media only screen and (max-height: 1100px) and (min-height: 1001px) {
  .enterprise-grid--body,
  .pane-grid--body {
    max-height: 750px;
  }
  .enterprise-grid--body.shorter {
    max-height: 600px;
  }
}
/*
If viewport height is greater than or equal to 901, the set available height -- */
@media only screen and (min-height: 1101px) {
  .enterprise-grid--body,
  .pane-grid--body {
    max-height: 900px;
  }
  .enterprise-grid--body.shorter {
    max-height: 750px;
  }
}
/*  #region  MEDIA QUERIES  */
@media only screen and (max-width: 1280px) {
  .keys .key,
  .keys .more-ids {
    font-size: 9pt;
    line-height: 9pt;
  }
  .keys .key .key--label,
  .keys .more-ids .key--label {
    font-size: 8.5pt;
  }
  .keys .key .key--data,
  .keys .more-ids .key--data {
    font-size: 10.5pt;
  }
  .keys .more-ids {
    padding-top: 15px;
  }
}
/* #endregion */
/*  PERFECTSCROLLBAR  */
/*  Additional scrollbar - perfect-scrollbar v0.6.11 @https://github.com/utatti/perfect-scrollbar */
/*  #region  PERFECT SCROLLBAR  */
.ps-container {
  overflow: hidden !important;
}
/*@supports (-ms-overflow-style: none) {
    .ps-container {
      overflow: auto !important;
    }
  }*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .ps-container {
    overflow: auto !important;
  }
}
.ps-container.ps-active-x > .ps-scrollbar-x-rail,
.ps-container.ps-active-y > .ps-scrollbar-y-rail {
  display: block;
  background-color: transparent;
}
.ps-container.ps-in-scrolling {
  pointer-events: none;
}
.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
  /*background-color: #eee;*/
  opacity: 0.9;
}
.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  background-color: #999;
}
.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
  /*background-color: #eee;*/
  opacity: 0.9;
}
.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  background-color: #999;
}
.ps-container > .ps-scrollbar-x-rail {
  display: none;
  position: absolute;
  /* please don't change 'position' */
  border-radius: 4px;
  opacity: 0;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  bottom: 3px;
  /* there must be 'bottom' for ps-scrollbar-x-rail */
  height: 8px;
}
.ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  position: absolute;
  /* please don't change 'position' */
  background-color: #aaa;
  border-radius: 4px;
  transition: background-color 0.2s linear;
  bottom: 0;
  /* there must be 'bottom' for ps-scrollbar-x */
  height: 8px;
}
.ps-container > .ps-scrollbar-y-rail {
  display: none;
  position: absolute;
  /* please don't change 'position' */
  border-radius: 4px;
  opacity: 0;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  right: 3px;
  /* there must be 'right' for ps-scrollbar-y-rail */
  width: 8px;
}
.ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  position: absolute;
  /* please don't change 'position' */
  background-color: #aaa;
  border-radius: 4px;
  transition: background-color 0.2s linear;
  right: 0;
  /* there must be 'right' for ps-scrollbar-y */
  width: 8px;
}
.ps-container:hover.ps-in-scrolling {
  pointer-events: none;
}
.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
  /*background-color: #eee;*/
  opacity: 0.9;
}
.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  background-color: #999;
}
.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
  /*background-color: #eee;*/
  opacity: 0.9;
}
.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  background-color: #999;
}
.ps-container:hover > .ps-scrollbar-x-rail,
.ps-container:hover > .ps-scrollbar-y-rail {
  opacity: 0.6;
}
.ps-container:hover > .ps-scrollbar-x-rail:hover {
  /*background-color: #eee;*/
  opacity: 0.9;
}
.ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x {
  background-color: #999;
}
.ps-container:hover > .ps-scrollbar-y-rail:hover {
  /*background-color: #eee;*/
  opacity: 0.9;
}
.ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
  background-color: #999;
}
/* Overrides for filterable column headers*/
.ps-scrollbar-y,
.ps-scrollbar-y-rail {
  width: 5px !important;
}
/* #endregion */
/*  #region  LIST OF VALUES  */
.lov .guidance,
.lov .lov-wrapper {
  margin-left: 120px;
}
.lov .guidance,
.lov .guidance--minor {
  color: #777;
}
.lov .guidance {
  padding: 15px 0 30px 0;
}
.lov .guidance--minor {
  font-size: 0.925rem;
  padding: 0 0 18px 0;
}
.lov .list-wrapper,
.lov .values-wrapper {
  height: 75vh;
  margin-left: 120px;
}
.lov .list--width {
  margin-right: 40px;
  width: 225px;
}
.lov .values-wrapper .list--group-name {
  font-size: 20pt;
  font-weight: 300;
  margin-bottom: 0.66677rem;
}
.lov #js-values-grid {
  height: 335px;
  margin-bottom: 20px;
  overflow: hidden;
  width: 300px;
}
/* #endregion */
/* -----------------------------------------------------------------------------
   CHARACTERISTICS.CSS
   Essential display rules for specification features. Three display techniques
   are used as follows:
   1. IMAGE-based - PNG files are sued as background images.
   2. HTML-CHARACTER-REFERENCES - certain HTML entities are used as symbols, using
   the standard font.
   3. GLYPHS - many GDT symbols are implemented as font-fylphs based on the webfont
   GDTRegular.
--------------------------------------------------------------------------------*/
.angularity,
.arcofline,
.chamfer,
.circular-runout,
.circularity,
.concentricity,
.counterbore,
.countersink,
.cylindricity,
.depth,
.diameter,
.flatness,
.generic,
.ingredient,
.line-profile,
.linear-dimension,
.note,
.parallelism,
.percent,
.perpendicularity,
.position,
.position-diametric,
.position-spherical,
.quantity,
.radius,
.surface-roughness,
.slope,
.spherical-radius,
.square,
.straightness,
.symmetry,
.tap-depth,
.tap-diameter,
.taper,
.thread,
.thread-depth,
.total-runout {
  background-color: transparent;
  font-weight: 600;
}
.angle {
  font-weight: 300;
}
/*  HTML ENTITY BASED (NORMAL FONT)  */
.angle:after,
.ingredient:after,
.percent:after,
.position-diametric:after,
.position-spherical:after,
.quantity:after,
.radius:after,
.spherical-radius:after {
  color: #000;
  display: block;
  text-align: center;
}
/*  GLYPH BASED (GDT REGULAR FONT)  */
.angularity:after,
.arcofline:after,
.circular-runout:after,
.circularity:after,
.concentricity:after,
.counterbore:after,
.countersink:after,
.cylindricity:after,
.depth:after,
.diameter:after,
.flatness:after,
.generic:after,
.line-profile:after,
.parallelism:after,
.perpendicularity:after,
.position:after,
.slope:after,
.square:after,
.straightness:after,
.surface-profile:after,
.symmetry:after,
.taper:after,
.total-runout:after {
  display: block;
  font-family: "GDTRegular";
  text-align: center;
}
/*  ENTITY & GLYPH BASED  */
/*.angle:after {
//  content: '\2221';
  font-size: 22px;
  font-weight: 400;
}*/
.angularity:after {
  content: '\0061';
}
.arcofline:after {
  content: '\006B';
}
.circular-runout:after {
  content: '\0068';
}
.circularity:after {
  content: '\0065';
}
.concentricity:after {
  content: '\0072';
}
.counterbore:after {
  content: '\0076';
}
.countersink:after {
  content: '\0077';
}
.cylindricity:after {
  content: '\0067';
}
.depth:after {
  content: '\0078';
}
.diameter:after {
  content: '\006E';
}
.flatness:after {
  content: '\0063';
}
.generic:after {
  content: "?";
}
.ingredient:after {
  content: "\2935";
}
.line-profile:after {
  content: '\006B';
}
.parallelism:after {
  content: '\0066';
}
.percent:after {
  content: '\0025';
}
.perpendicularity:after {
  content: '\0062';
}
.position:after {
  content: '\006A';
}
.quantity:after {
  content: '\0023';
}
.radius:after {
  content: '\0052';
}
.roughness-average:after {
  content: '\221A';
}
.slope:after {
  content: '\007A';
  font-size: 0.67em;
  line-height: 2em;
}
/*.spherical-diameter:after {
  content:'\0053\2205';
}*/
.spherical-radius:after {
  content: '\0053\0052';
}
.square:after {
  content: '\006F';
}
.straightness:after {
  content: '\0075';
}
.surface-profile:after {
  content: '\0064';
}
.symmetry:after {
  content: '\0069';
}
.taper:after {
  content: '\0079';
  font-size: 0.55em;
  line-height: 2.75em;
}
.total-runout:after {
  content: '\0074';
}
/*  IMAGE BASED  */
/*.arcofline {
  background: transparent url(../img/_symbols/icon_arc.png) center center no-repeat;
  background-size: 25px;
}*/
.angle {
  background: transparent url(../img/_symbols/angle.png) center center no-repeat;
  background-size: 20px;
}
.chamfer {
  background: transparent url(../img/_symbols/icon_chamfer.png) left center no-repeat;
  background-size: 20px;
}
.linear-dimension {
  background: transparent url(../img/_symbols/icon_linear_dimension.png) center center no-repeat;
  background-size: 22px;
}
.position-diametric {
  background: transparent url(../img/_symbols/position_diametric.png) center center no-repeat;
  background-size: 28px;
}
.position-spherical {
  background: transparent url(../img/_symbols/position_spherical.png) center center no-repeat;
  background-size: 26px;
}
.spherical-diameter {
  background: transparent url(../img/_symbols/spherical_diameter.png) center center no-repeat;
  background-size: 28px;
}
.surface-roughness {
  background: transparent url(../img/_symbols/surface_roughness.png) center center no-repeat;
  background-size: 22px;
}
.tap-depth {
  background: transparent url(../img/_symbols/icon_tap_depth.png) center center no-repeat;
  background-size: 22px;
}
.tap-diameter {
  background: transparent url(../img/_symbols/icon_tap_diameter.png) center center no-repeat;
  background-size: 22px;
}
.thread {
  background: transparent url(../img/_symbols/icon_thread.png) center center no-repeat;
  background-size: 22px;
}
.thread-depth {
  background: transparent url(../img/_symbols/icon_thread_depth.png) center center no-repeat;
  background-size: 22px;
}
.login .column {
  height: 85vh;
}
.login .pane {
  height: 85vh;
  margin: 5vh 0;
  flex: 0 0 50vw;
}
.login .banner {
  background-color: #0074d9;
  color: #ffffff;
  font-weight: 300;
  width: 500px;
}
.login .banner.validated {
  background-color: #008080;
}
.login .banner.validated h3 {
  font-size: 30px;
}
.login .banner a {
  color: #ffffff;
}
.login .left {
  background-color: #ffffff;
}
.login .left .banner {
  flex: 0 0 150px;
  height: 150px;
  padding: 25px 40px;
  text-align: center;
}
.login .left .banner h3 {
  color: #ffffff;
  margin: 0;
  padding: 0 0 7px 0;
}
.login .left .banner p {
  color: #dddddd;
  font-weight: 300;
  margin: 0;
}
.login .right {
  background-color: #ffffff;
}
.login .right .banner {
  flex: 0 0 60px;
  font-size: 16pt;
  margin: 0;
  padding: 0;
  text-align: left;
}
.login .right .banner .btm {
  font-size: 11pt;
  margin-right: 2px;
}
.login .right .banner .devices {
  background-color: #001f3f;
  color: #2ecc40;
  flex: 0 0 60px;
  line-height: 59px;
  margin: 0;
  text-align: center;
}
.login .right .banner .guidance {
  line-height: 59px;
  padding-left: 10px;
}
.login .art {
  background: url(../img/art.jpg) center center no-repeat;
  background-size: 500px 335px;
  flex: 0 0 335px;
  height: 335px;
  width: 500px;
}
.login .form-elements {
  border-right: 1px solid #d8d8d8;
  flex: 0 0 349px;
  padding: 40px 65px 0;
  width: 500px;
}
.login .form-elements label,
.login .form-elements p {
  color: #444;
  font-size: 12pt;
  font-weight: 300;
}
.login .form-elements label {
  display: block;
  margin-bottom: 5px;
}
.login .form-elements input {
  margin-bottom: 20px;
  height: 40px;
  width: 100%;
}
.login .form-elements p {
  margin: 5px 0;
}
.login .form-elements p.olive {
  color: #3d9970;
}
.login .form-elements .btm {
  margin-right: 6px;
}
.login .form-elements .btn--default {
  height: 40px;
  margin-top: 20px;
  width: 125px;
}
.login .form-elements .btn--default:hover {
  cursor: pointer;
}
.login .links {
  background-color: #ffffff;
  border-right: 1px solid #d8d8d8;
  border-bottom: 1px solid #d8d8d8;
  flex: 0 0 76px;
  width: 500px;
}
.login .links .link {
  background-color: #F2F2f2;
  border-right: 1px solid #d8d8d8;
  cursor: pointer;
  font-size: 9pt;
  font-weight: 300;
  height: 60px;
  line-height: 12pt;
  margin-top: 15px;
  padding: 20px;
  padding-top: 23px;
  text-align: center;
  text-transform: uppercase;
  transition: all 300ms ease;
}
.login .links .link:last-child {
  border-right: none;
}
.login .links .link:hover {
  background-color: #444;
  border: 1px solid #444;
  color: #ffffff;
}
.legal {
  font-size: 8pt;
}
.legal div {
  color: #0074d9;
  margin: 10px;
}
/*  #region  USER  */
.enterprise-grid.organizations,
.enterprise-grid.accounts-list {
  padding-left: 120px;
}
.in-place {
  border: none;
  border-bottom: 1px solid #d8d8d8;
}
.change-password,
.profile {
  margin-left: 120px;
  margin-top: 20px;
}
.accounts label,
.change-password label,
.organization label,
.profile label {
  line-height: 33px;
}
.accounts label,
.change-password label,
.organization label,
.profile label,
.accounts input,
.change-password input,
.organization input,
.profile input {
  height: 34px;
}
.change-password .btn--default {
  height: 34px;
  margin-left: 30px;
}
.accounts,
.organization {
  margin-left: 63px;
  margin-top: 25px;
}
.accounts .flex,
.organization .flex {
  margin-top: 7px;
}
.accounts {
  margin-top: 0;
}
.actions {
  margin-top: 30px;
}
.actions + .actions {
  margin-top: 30px;
}
.action {
  min-width: 107px;
}
.action + .action {
  margin-left: 15px;
}
.profile .acceptance {
  line-height: 33px;
  margin-left: 15px;
}
.profile .checkbox-styled,
.profile .checkbox:before,
.profile .checkbox:after {
  height: 34px;
  width: 34px;
}
.matrix-color-swatch {
  font-weight: 600;
  text-align: right;
  padding-right: 30px;
  padding-top: 8px;
}
/* #endregion */
/* #region SINGLE PLAN */
.plan #js-plan-edition {
  margin-right: 10px;
}
.plan #js-plan-state {
  margin-left: 10px;
}
.plan.upload {
  margin-bottom: 25px;
  margin-left: 63px;
}
.plan.defaults {
  margin-bottom: 30px;
  margin-left: 63px;
  max-width: 40%;
  min-width: 40%;
}
.plan.defaults #defaults {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.plan.documents .document {
  border-bottom: 1px solid #d8d8d8;
}
.plan.documents .document:first-child {
  border-top: 1px solid #d8d8d8;
}
.plan.documents .document .file-name,
.plan.documents .document .file-icon,
.plan.documents .document .file-info,
.plan.documents .document .command-empty,
.plan.documents .document .command {
  border-left: 1px solid #d8d8d8;
  box-sizing: border-box;
  min-height: 40px;
  max-height: 40px;
}
.plan.documents .document .command {
  border-right: 1px solid #d8d8d8;
  color: #111;
  cursor: pointer;
  font-size: 17pt;
  font-weight: 300;
  line-height: 38px;
}
.plan.documents .document .command:hover {
  background-color: #FF4136;
  border: 1px solid #FF4136;
  color: white;
}
.plan.documents .document .command,
.plan.documents .document .file-icon {
  flex: 0 0 40px;
  line-height: 38px;
  text-align: center;
  width: 40px;
}
.plan.documents .document .file-name,
.plan.documents .document .file-info {
  color: #000;
  font-size: 10pt;
  height: 40px;
  line-height: 33px;
  margin: 0;
  overflow: hidden;
  padding: 3px 3px 3px 6px;
  text-overflow: ellipsis;
}
.plan.documents .document .file-info {
  flex: 0 0 90px;
  text-align: center;
}
.plan.documents .document .file-name {
  flex: auto;
}
.plan.icons {
  overflow-y: auto;
  max-height: 360px;
  /*border-bottom: 1px solid #d8d8d8;*/
}
.plan.icons .icon {
  line-height: 70px;
  cursor: pointer;
  border-top: 1px solid #d8d8d8;
}
.plan.icons .icon:hover {
  border: 2px solid #FF851B;
}
.plan.icons .icon img {
  max-width: 100%;
  max-height: 100%;
}
.plan.icons .icon .file-icon {
  width: 80px;
}
.plan.icons .icon .file-name,
.plan.icons .icon .file-info {
  color: #000;
  font-size: 10pt;
  margin: 0;
  overflow: hidden;
  padding: 3px 3px 3px 6px;
  text-overflow: ellipsis;
}
.plan.icons .icon .file-info {
  flex: 0 0 90px;
  padding-right: 10px;
  text-align: right;
}
.plan.icons .icon .file-name {
  flex: auto;
}
.instr_image {
  line-height: 300px;
  /*cursor: pointer;*/
  font-size: 10pt;
}
.instr_image img {
  max-width: 100%;
  max-height: 360px;
}
.plan.history .search-container {
  margin-right: -20px;
}
.plan.history .cell .btm {
  margin-right: 4px;
}
.plan.history .account {
  /*flex: 0 0 175px;*/
  flex: 0 0 140px;
}
.plan.history .timestamp {
  /*flex: 0 0 110px;*/
  flex: 0 0 140px;
  text-align: center;
}
.plan.history .revision-number {
  flex: 0 0 60px;
  text-align: center;
}
/* #region PLANS TABLES  */
.enterprise-grid.plans {
  /*.is-shared {
    flex: 0 0 80px;
    text-align: center;
    }*/
  /* overwrite work instructions styles from ide-matrix.less - used for IDE screens */
}
.enterprise-grid.plans .part-number {
  flex: 0 0 225px;
}
.enterprise-grid.plans .specs {
  flex: 0 0 65px;
  text-align: right;
}
.enterprise-grid.plans .commands {
  flex: 0 0 30px;
}
.enterprise-grid.plans .part-description {
  flex: auto;
}
.enterprise-grid.plans .no-work-instructions {
  cursor: pointer;
}
.enterprise-grid.plans .no-work-instructions:hover {
  background: #0074d9 url('../img/icons/column-wrench-na.svg') no-repeat center center;
  background-size: 24px;
  cursor: pointer;
}
.pane-grid.plans .part-number {
  flex: 0 0 125px;
}
.pane-grid.plans .part-description {
  flex: auto;
}
.handsontable .cell-characteristic {
  width: 40px;
  height: 30px;
  display: inline-block;
  vertical-align: middle;
  margin-left: 6px;
}
/*  MEDIA QUERIES
------------------------------------------------------------------------------- */
/*  ---  MAX : @dimension is ( less than | equal to )      @value ------------- */
/*  ---  MIN : @dimension is ( greater than | equal to )   @value ------------- */
/*  TABLE HEIGHT :: RowHeight (30px)

If viewport height is less-than or equal to 766, then set available height ---- */
/*  PLANS TABLE

    WIDTH-----------

If viewport width is less-than or equal to 1280, then set certain column widths
to smaller sizes -------------------------------------------------------------- */
@media only screen and (max-width: 1280px) {
  .plans .description {
    flex: auto;
  }
  .plans .part-number {
    flex: 0 0 125px;
  }
}
/*
If viewport width is greater-than or equal to 1281, then set certain column
widths to larger sizes -------------------------------------------------------- */
@media only screen and (min-width: 1281px) {
  .plans .description {
    flex: auto;
  }
  .plans .part-number {
    flex: 0 0 175px;
  }
}
/*  #region  SPECIFICATION  */
.spec--notes {
  min-height: 123px;
  padding: 9px 4px;
}
.method-sampling-table {
  margin-top: 20px;
  border: 1px solid #DDDDDD;
  border-bottom: none;
}
.method-sampling-table ::-webkit-input-placeholder {
  /* Most modern browsers support this now. */
  color: silver;
}
.method-sampling-table ::-moz-placeholder {
  /* Most modern browsers support this now. */
  color: silver;
}
.method-sampling-table ::-ms-input-placeholder {
  /* Most modern browsers support this now. */
  color: silver;
}
.method-sampling-table ::placeholder {
  /* Most modern browsers support this now. */
  color: silver;
}
.method-sampling-table .type,
.method-sampling-table .check,
.method-sampling-table .meth,
.method-sampling-table .samp,
.method-sampling-table .dtype {
  font-weight: 300;
  padding: 0px;
  padding-left: 10px;
}
.method-sampling-table .type {
  border-bottom: 1px solid #DDDDDD;
  border-right: 1px solid #DDDDDD;
  flex: 0 0 20%;
  line-height: 40px;
}
.method-sampling-table .check {
  border-bottom: 1px solid #DDDDDD;
  border-right: 1px solid #DDDDDD;
  flex: 0 0 10%;
}
.method-sampling-table .meth,
.method-sampling-table input.meth,
.method-sampling-table .samp,
.method-sampling-table input.samp,
.method-sampling-table .dtype,
.method-sampling-table select.dtype {
  border: none;
  border-bottom: 1px solid #DDDDDD;
  flex: 0 0 35%;
}
.method-sampling-table .meth,
.method-sampling-table input.meth {
  border-right: 1px solid #DDDDDD;
}
.method-sampling-table .heading.type,
.method-sampling-table .heading.check,
.method-sampling-table .heading.meth,
.method-sampling-table .heading.samp,
.method-sampling-table .heading.dtype {
  background-color: #F3F3F3;
  border: none;
  border-right: 1px solid #DDDDDD;
  border-bottom: 1px solid #DDDDDD;
  font-weight: 300;
  line-height: 40px;
}
.method-sampling-table .heading.notes {
  border-right: none;
}
.method-sampling-table .check select,
.method-sampling-table .meth input,
.method-sampling-table .samp input,
.method-sampling-table .dtype select {
  border: 0;
  margin-bottom: 0 !important;
}
.method-sampling-table.extended .meth,
.method-sampling-table.extended input.meth,
.method-sampling-table.extended .samp,
.method-sampling-table.extended input.samp {
  flex: 0 0 28%;
}
.method-sampling-table.extended .dtype,
.method-sampling-table.extended select.dtype {
  flex: 0 0 14%;
}
.method-sampling-table.extended .samp,
.method-sampling-table.extended input.samp {
  border-right: 1px solid #DDDDDD;
}
.method-sampling-table.extended .heading.dtype {
  border-right: none;
}
/*  #region  INSPECTIONS  */
/* #region PANE INLINE HELP */
.pane--inline-help {
  background-color: #0074d9;
  color: #ffffff;
  font-size: 10.333pt;
  font-weight: 300;
  margin-bottom: 20px;
  padding: 10px 15px 10px 20px;
}
.pane--inline-help .btm {
  font-size: 11pt;
  flex: 0 0 45px;
  padding-top: 3px;
}
.approval .esignature {
  background-color: rgba(46, 204, 64, 0.15);
  border: 1px solid #2ecc40;
}
.rejection .esignature {
  background-color: rgba(204, 46, 64, 0.15);
  border: 1px solid #cc2e40;
}
.esignature {
  background-color: rgba(0, 116, 217, 0.15);
  border: 1px solid #0074d9;
  border-radius: 3px;
  -webkit-column-gap: 16px;
     -moz-column-gap: 16px;
          column-gap: 16px;
  display: grid;
  grid-template-columns: 1fr 300px;
  grid-template-rows: -webkit-min-content 1fr;
  grid-template-rows: min-content 1fr;
  min-height: 75px;
  padding: 12px 24px;
  row-gap: 6px;
  width: 100%;
}
.esignature .attestation-text {
  font-size: 13px;
  font-style: italic;
  font-weight: 400;
  grid-column: 1;
  grid-row: 2;
  padding: 0 16px;
}
.esignature .signature-info {
  grid-column: 2;
  grid-row: 2;
}
.esignature .signature-info input {
  border-radius: 3px;
  border: 1px solid #d8d8d8;
  font-size: 12px;
  height: 32px;
  padding: 4px 10px;
  width: 80%;
}
.esignature .signature-name {
  font-weight: bold;
  font-size: 13px;
}
.esignature .signature-date {
  font-size: 13px;
  font-style: italic;
}
/*  #region IDENTIFIERS  */
.pane-container .inspection-identifiers input,
.pane-container .inspection-identifiers .inspection-types,
.pane-container .inspection-identifiers .inspection-disposition {
  margin-bottom: 15px;
}
.pane-container .inspection-identifiers .inspection-type.choice,
.pane-container .inspection-identifiers .inspection-disposition.choice {
  font-size: 10pt;
  font-weight: 300;
}
.pane-container .inspection-identifiers .inspection-type.choice:focus,
.pane-container .inspection-identifiers .inspection-type.choice.selected,
.pane-container .inspection-identifiers .inspection-disposition.choice:focus,
.pane-container .inspection-identifiers .inspection-disposition.selected:focus {
  border: 1px solid #0074d9;
}
.pane-container .inspection-identifiers #js-selector--inspection-handle-value,
.pane-container .inspection-identifiers #js-part-number-revision {
  border-left: 0;
}
.pane-container .inspection-identifiers .inspection-pass {
  border-bottom: 2px solid #3D9970;
}
.pane-container .inspection-identifiers .inspection-fail {
  border-bottom: 2px solid #FF4136;
}
.pane-container .inspection-identifiers .handsontable input.htCheckboxRendererInput {
  margin-bottom: 5px;
}
.pane-container .ide-identifiers input {
  margin-bottom: 25px;
}
/*  #region FILE UPLOADS - same as plan.less Documents */
.inspection.reports {
  margin-bottom: 30px;
  margin-left: 63px;
  max-width: 85%;
  min-width: 85%;
}
.inspection.reports .report {
  width: inherit;
}
.inspection.reports .report + .report .file-name,
.inspection.reports .report + .report .file-icon,
.inspection.reports .report + .report .file-info,
.inspection.reports .report + .report .command,
.inspection.reports .report + .report .report-name {
  border-top: none;
}
.inspection.reports .report .command,
.inspection.reports .report .file-icon,
.inspection.reports .report .report-name {
  border: 1px solid #d8d8d8;
  border-right: none;
  box-sizing: border-box;
  min-height: 40px;
  max-height: 40px;
}
.inspection.reports .report .report-name {
  border: 1px solid #d8d8d8;
  font-size: 14pt;
}
.inspection.reports .report a {
  color: inherit;
  text-decoration: none;
}
.inspection.reports .report .report-name:hover {
  background-color: #0074d9;
  color: #ffffff;
}
.inspection.reports .report .command {
  border-right: 1px solid #d8d8d8;
  color: #111;
  cursor: pointer;
  font-size: 17pt;
  font-weight: 300;
  line-height: 38px;
}
.inspection.reports .report .command {
  font-size: 12pt;
  font-weight: 300;
  line-height: 38px;
  text-transform: uppercase;
}
.inspection.reports .report .command:hover {
  background-color: #0074d9;
  border: 1px solid #0074d9;
  color: white;
}
.inspection.reports .report .command,
.inspection.reports .report .file-icon {
  flex: 0 0 40px;
  line-height: 38px;
  text-align: center;
  width: 40px;
}
.inspection.reports .report .report-name {
  color: #000;
  font-size: 10pt;
  height: 40px;
  line-height: 33px;
  margin: 0;
  overflow: hidden;
  padding: 3px 3px 3px 6px;
  text-overflow: ellipsis;
}
.inspection.reports .report .report-name {
  flex: auto;
}
.report .report-name {
  cursor: pointer;
}
.inspection.reports.disabled .report .report-name {
  color: lightgray;
  cursor: not-allowed;
}
.inspection.upload {
  margin-bottom: 25px;
  margin-left: 63px;
}
/*  #region INSPECTION DATA ENTRY  */
.command--icon.sample-size,
.command--icon.grade-all {
  font-size: 17pt;
  line-height: 25px;
  padding-bottom: 3px;
}
.command--icon.sample-size:after {
  content: '\0023';
}
.command--icon.grade-all:after {
  content: '\2200';
}
.command--icon.grade-all + .command--label {
  margin-top: 4px;
}
/*  #region SAMPLE-SIZE, GRADE ALL SLIDEOUTS   */
.ide.pane-container {
  right: none;
  left: 50px;
}
.ide.pane-container--small {
  width: 350px;
}
/*  #region WORK INSTRUCTIONS SLIDEOUT  */
.ide-work-instructions {
  max-height: 75%;
  min-height: 33%;
  overflow-x: hidden;
  overflow-y: scroll;
  padding-left: 63px;
  width: 95%;
}
/*  #region INSPECTION DETAILS SLIDEOUT  */
.inspection-disposition-by {
  border: 1px solid #DEDEDE;
  color: #454545;
  font-size: 0.67rem;
  height: 40px;
  padding-left: 10px;
  padding-top: 3px;
  margin-left: 5px;
}
/* #region INSPECTION SPEC COMMENTS SLIDEOUT   */
.ide-spec-comments {
  max-height: 75%;
  min-height: 50%;
  overflow-y: hidden;
  padding-left: 63px;
  width: 95%;
}
.ide-spec-comments textarea {
  height: 33vh;
  padding: 5px;
  font-size: 0.875rem;
}
.text--ncmr,
.text--notes {
  font-size: 0.75rem;
  white-space: pre-wrap;
}
.text--ncmr:focus,
.text--notes:focus {
  background-color: LemonChiffon;
}
/*  #region CHARTS  */
.charts {
  background-color: #FFFFFF;
  height: 0;
  width: 0;
}
.multi-charts {
  display: grid;
  grid-auto-rows: minmax(130px, 1fr);
  overflow-y: scroll;
  width: 100%;
}
.multi-detail-charts {
  overflow-y: scroll;
  width: 100%;
  padding-left: 50px;
}
#chart--tally,
#chart--control,
#chart--histogram {
  width: inherit;
}
#chart--control {
  border-left: 1px solid #d8d8d8;
  border-bottom: 1px solid #d8d8d8;
  height: 100%;
  padding: 3px;
}
#chart--histogram {
  border-left: 1px solid #d8d8d8;
  height: 100%;
  padding: 7px;
}
#chart--tally {
  color: #d8d8d8;
  font-size: 21pt;
  font-weight: 300;
  padding: 30px;
  text-align: center;
}
#histogram,
#chart--histogram .statistics {
  flex: 0 0 50%;
  height: 100%;
}
#chart--histogram .statistics {
  height: 99%;
  padding-left: 10px;
  padding-right: 5px;
}
#chart--histogram .statistics table {
  height: 100%;
  width: 100%;
}
#chart--histogram .statistics tr:nth-child(odd) {
  background-color: rgba(208, 254, 255, 0.2);
}
#chart--histogram .statistics tr:nth-child(odd) td:nth-child(even) {
  background-color: rgba(208, 254, 255, 0.35);
}
#chart--histogram .statistics .label,
#chart--histogram .statistics .value {
  font-size: 12px;
  font-weight: 300;
  padding: 1px 3px;
}
#chart--histogram .statistics .label {
  padding-left: 8px;
  width: 27%;
}
#chart--histogram .statistics .value {
  font-weight: 600;
  width: 23%;
}
#chart--histogram .statistics .label-red {
  color: #FFF;
  background-color: #FF4136;
  padding: 2px 3px;
  font-weight: 400;
}
#chart--histogram .statistics .label-yellow {
  background-color: #FFDC00;
  padding: 2px 3px;
  font-weight: 400;
}
#chart--histogram .statistics .label-green {
  color: #FFF;
  background-color: #3D9970;
  padding: 2px 3px;
  font-weight: 400;
}
/* #region EXCEL LIKE TABLE  */
.grid--matrix {
  padding-left: 50px;
}
/* EXCEL LIKE TABLE :: MATRIX LAYOUT  */
.grid--matrix .matrix {
  height: 100%;
  width: 100%;
  overflow: hidden;
}
.grid--matrix .handsontable .grid--specification {
  text-transform: uppercase;
}
.grid--matrix .handsontable .grid--specification.currentCol,
.grid--matrix .handsontable .grid--specification.currentRow,
.grid--matrix .handsontable .grid--icon.currentCol,
.grid--matrix .handsontable .grid--icon.currentRow {
  color: #000000;
}
.no-uppercase .handsontableInput {
  text-transform: none;
}
.grid--matrix .handsontable .grid--value {
  font-weight: 600;
  text-transform: uppercase;
}
.grid--matrix .handsontable .grid--value.currentRow {
  background-color: #ff851b;
}
.handsontable .grid--not-set,
.handsontable .grid--pass,
.handsontable .grid--fail,
.handsontable .grid--na,
.handsontable .grid--unknown {
  padding-right: 30px !important;
  text-align: right;
}
.handsontable .grid--not-set {
  background: transparent url(../img/icons/checkbox3.svg) no-repeat right 10px center;
  background-size: 12px;
}
.handsontable .grid--pass {
  background: transparent url(../img/icons/pass.svg) no-repeat right 10px center;
  background-size: 12px;
}
.handsontable .grid--fail {
  background: transparent url(../img/icons/fail.svg) no-repeat right 10px center;
  background-size: 12px;
  color: #FF4136;
}
.handsontable .grid--na {
  background: transparent url(../img/icons/na.svg) no-repeat right 10px center;
  background-size: 12px;
}
.handsontable .grid--fail.htInvalid {
  color: #111111;
}
.handsontable .grid--dup {
  background: transparent url(../img/icons/warning-orange.svg) no-repeat right 10px center;
  background-size: 16px;
  color: #FF7700;
}
.handsontable .grid--unknown {
  background: transparent url(../img/icons/questions3.svg) no-repeat right 10px center;
  background-size: 12px;
}
.handsontable .grid--status {
  text-align: center;
  color: #FFFFFF;
  text-transform: uppercase;
}
.handsontable .grid--status.status--ok {
  background-color: #3D9970;
  color: #FFFFFF;
}
.handsontable .grid--status.status--warn {
  color: #111111;
  background-color: #FFDC00;
}
.handsontable .grid--status.status--error {
  background-color: #FF4136;
  color: #FFFFFF;
}
.handsontable .grid--status.status--na {
  background-color: gray;
  color: #FFFFFF;
}
.handsontable .rowHeader .first_piece {
  background-color: #0074d9;
  color: #FFFFFF;
}
.handsontable .rowHeader .excluded {
  background-color: #FF4136;
  color: #FFFFFF;
}
.handsontable .rowHeader .rework {
  background-color: #3D9970;
  color: #FFFFFF;
}
/* #region Traveler v1 */
.loading-data {
  color: #ddd;
  font-size: 35pt;
  font-weight: 300;
  margin: 3.333em auto;
  width: 400px;
}
/*  #region SPEC COMPOSITE  -- Duplicative from Plans.css  */
.spec-composite-group span {
  padding: 0 5px 0 0;
}
.spec-composite-group span:last-child {
  padding: 0 0 0 0;
}
.spec-composite-group.basic {
  border: 1px solid black;
  padding: 0px 4px;
  font-size: 9.75pt;
}
.spec-name,
.spec-composite,
.spec-composite-group {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.modifier,
.uom {
  padding-left: 7px;
  /* text-transform: uppercase; */
}
.cell.data.instructions i {
  margin: 0 5px 0 2px;
}
.icon--spec,
.spec-name {
  margin-right: 10px;
}
.icon--spec {
  max-width: 25px;
  min-width: 25px;
}
.icon--spec + .icon--spec {
  margin-left: -13px;
  padding-left: 0;
}
/*  MEDIA QUERIES
------------------------------------------------------------------------------- */
/*  ---  MAX : @dimension is ( less than | equal to )      @value ------------- */
/*  ---  MIN : @dimension is ( greater than | equal to )   @value ------------- */
/*  TABLE HEIGHT :: RowHeight (30px)

If viewport height is less-than or equal to 766, then set available height ---- */
@media only screen and (max-height: 766px) {
  .pane-container .inspection-identifiers .inspection-type.choice {
    font-size: 9.333pt;
  }
}
/*  INSPECTIONS - TABLE

    WIDTH-----------

    If viewport is less-than or equal to 1280px ...
    ---------------------------------------------------------------------------- */
@media only screen and (max-width: 1280px) {
  .inspections .customer,
  .inspections .part-number {
    flex: 0 0 130px;
  }
  .inspections .inspection-type,
  .inspections .revised {
    flex: 0 0 50px;
  }
  .inspections .is-serialized,
  .inspections .is-shared {
    flex: 0 0 60px;
    text-align: center;
  }
  .inspections .commands {
    flex: 0 0 30px;
  }
  .inspections .part-description {
    flex: auto;
  }
}
/* If viewport is greater-than 1280px and less-than, equal to 1440px
     ----------------------------------------------------------------------------- */
@media only screen and (min-width: 1281px) and (max-width: 1440px) {
  .inspections .handle {
    flex: 0 0 215px;
  }
  .inspections .customer,
  .inspections .part-number {
    flex: 0 0 160px;
  }
  .inspections .inspection-type,
  .inspections .revised {
    flex: 0 0 60px;
  }
  .inspections .is-serialized,
  .inspections .is-shared {
    flex: 0 0 70px;
    text-align: center;
  }
  .inspections .commands {
    flex: 0 0 30px;
  }
  .inspections .part-description {
    flex: auto;
  }
}
@media only screen and (max-height: 766px) {
  .pane-container .inspection-identifiers .inspection-type.choice {
    font-size: 9.25pt;
  }
}
/*  #region  BALLOONING  */
.ballooning {
  overflow: scroll;
  padding-left: 50px;
  position: relative;
  /*.done {
        background-color: #3D9970;
        border-radius: 10px;
        box-shadow: 1px 1px 1px #333;
        color: white;
        display: block;
        font-size: 7pt;
        height: 20px;
        left: 0;
        line-height: 22px;
        position: absolute;
        top: 0;
        transition: all 350ms ease;
        width: 20px;
        z-index: 2500;
        text-align: center;
    }
    #zoom {
        position: fixed;
        top: 20px;
        left: 20px;
        padding: 10px;
        color: red;
        font-family: Verdana;
        font-size: 18px;
        background: #fff;
        width: 200px;
        border: 2px solid red;
        border-radius: 6px;
        z-index: 2000;
    }*/
}
.ballooning area {
  cursor: pointer;
}
.ballooning img,
.ballooning object {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  border-top: 25px solid #C9C9C9;
  border-left: 12px solid #C9C9C9;
  margin-left: 240px;
}
.ballooning object {
  width: 100%;
  height: 100%;
}
.ballooning .balloon {
  background-color: white;
  border-radius: 20px;
  border: 2px solid #FF4136;
  color: #FF4136;
  cursor: pointer;
  font-family: 'Open Sans', Arial, sans-serif, Verdana;
  font-size: 20px;
  font-weight: 700;
  height: 40px;
  left: 0;
  line-height: 37px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 40px;
  z-index: 2000;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.ballooning .balloon.focus {
  color: white;
  background-color: #FF4136;
  box-shadow: 1px 1px 3px #111111;
  border: 2px solid #FFF;
}
.ballooning .rectangle {
  position: absolute;
  border: 1px solid rgba(0, 116, 217, 0.2);
  cursor: pointer;
  z-index: 1000;
}
.ballooning .rectangle.bluevalid {
  background-color: rgba(0, 116, 217, 0.1);
  /*@blue;
        opacity: 0.1;*/
}
.ballooning .rectangle.yellownote {
  background-color: rgba(255, 220, 0, 0.2);
  /*@yellow;
        opacity: 0.2;*/
}
.ballooning .rectangle.reddiff {
  border: 3px solid #2ECC40;
}
.ballooning #svg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 500;
}
.ballooning #svg line {
  stroke: red;
}
.ballooning .tips {
  position: absolute;
  top: 25px;
  width: 240px;
  flex: 0 0 199px;
  padding-top: 5px;
}
.ballooning .tips .tip {
  margin: 0px 5px 10px 5px;
}
.ballooning .tips .tip p {
  font-size: 0.8rem;
  margin: 0;
  padding: 5px 7px;
}
.ballooning .tips .tip p.label {
  background-color: #666666;
  color: white;
  text-align: center;
}
.ballooning .tips .tip p.body {
  background-color: #EEEEEE;
}
/* #endregion */
/*  #region MINISPEC  */
.pane-container--minispec {
  right: 0px;
  left: 0px;
  border-right: 3px solid #001F3F;
  margin-left: 50px;
  width: 241px;
  background-color: rgba(95, 158, 160, 0.25);
}
.pane-container--minispec .edit-spec--header {
  background-color: #000000;
  color: #FFFFFF;
  font-size: 13pt;
  font-weight: 300;
  padding: 7px;
  position: relative;
}
.pane-container--minispec .edit-spec--body {
  height: 100%;
}
.pane-container--minispec .edit-spec--body .flex-item {
  width: 119px;
}
.pane-container--minispec .edit-spec--body .label,
.pane-container--minispec .edit-spec--body input,
.pane-container--minispec .edit-spec--body select {
  background-color: #FFFFFF;
  border: none;
  border-bottom: 1px solid rgba(95, 158, 160, 0.25);
  border-right: 1px solid rgba(95, 158, 160, 0.25);
  color: black;
  height: 29px;
  line-height: 28px;
  padding-left: 5px;
}
.pane-container--minispec .edit-spec--body .selectize-input {
  height: 29px;
  line-height: 28px;
  border-width: 0 1px 1px 0;
  overflow: unset;
  font-size: 13pt;
}
.pane-container--minispec .edit-spec--body .selectize-dropdown-content {
  font-size: 13pt;
}
.pane-container--minispec .edit-spec--body .label {
  font-weight: 300;
}
.pane-container--minispec .edit-spec--body .selected {
  background-color: LemonChiffon;
  color: black;
}
.pane-container--minispec .edit-spec--body .spec--notes {
  min-height: 145px;
  padding: 5px 4px;
  font-size: 0.85rem;
}
.pane-container--minispec .edit-spec--body .bonus_pl {
  background-color: #FAFAFA;
  text-align: center;
}
.pane-container--minispec .edit-spec--body .disabled-input {
  background-color: #FAFAFA;
}
.pane-container--minispec .slideout .btn,
.pane-container--minispec .slideout .btn:hover {
  border: none;
  border-right: 1px solid rgba(95, 158, 160, 0.25);
}
.pane-container--minispec .edit-spec--header .leader-line-switch {
  color: red;
  background-color: #FFFFFF;
  cursor: pointer;
  position: absolute;
  right: 10px;
  top: 7px;
  font-weight: 700;
  padding: 0 5px 0 5px;
}
.pane-container--minispec .edit-spec--header .leader-line-switch.disabled {
  /*background-color: #999;*/
  background-color: #FAFAFA;
  color: rgba(255, 0, 0, 0.3333);
  cursor: not-allowed;
}
.ballooning.standard {
  height: 100vh;
}
/* #endregion */
.drawing-detail-container {
  width: 75%;
  aspect-ratio: 1;
  overflow: auto;
  margin: auto;
  position: relative;
  border: black solid 1px;
}
.drawing-detail-container .balloon {
  background-color: white;
  border-radius: 20px;
  border: 2px solid #FF4136;
  color: #FF4136;
  cursor: pointer;
  font-family: 'Open Sans', Arial, sans-serif, Verdana;
  font-size: 20px;
  font-weight: 700;
  height: 40px;
  left: 0;
  line-height: 37px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 40px;
  z-index: 2000;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.drawing-detail-container #svg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 500;
}
.drawing-detail-container #svg line {
  stroke: red;
}
.drawing-detail-zoom-controls {
  width: 75%;
  margin: auto;
}
.drawing-detail-zoom-controls .zoom-note {
  display: inline-flex;
  align-items: center;
  margin-left: 5px;
  float: right;
}
/*  #region  CAPAS (DEFECTS)  */
.caps {
  text-transform: uppercase;
}
.capa-container {
  height: 85vh;
  overflow-y: scroll;
}
.capa-features .feature {
  margin-left: 1.25rem;
}
.capa-team-container {
  height: 85vh;
  margin-bottom: 20px;
}
.unit--capa-team {
  min-width: 275px;
  max-width: 275px;
}
/*   CHART
-------------------------------------------------------------------------------- */
#capa-chart-container {
  height: 700px;
  /*100%;*/
  margin: 0 auto;
  margin-top: 40px;
  margin-left: 60px;
  width: calc(100% - 70px);
}
/*   COMMAND BAR
-------------------------------------------------------------------------------- */
.paperclip {
  background: transparent url('../img/svg/paperclip.svg') center top no-repeat;
  background-size: 30px 30px;
  height: 35px;
  width: 50px;
}
.command:hover .paperclip,
.paperclip:hover {
  background: transparent url('../img/svg/paperclip-hover.svg') center top no-repeat;
  background-size: 30px 30px;
  height: 35px;
  width: 50px;
}
.command.selected .paperclip {
  background: transparent url('../img/svg/paperclip-selected.svg') center top no-repeat;
  background-size: 30px 30px;
  height: 35px;
  width: 50px;
}
/* #region DISCIPLINES  - for 8D*/
.disciplines {
  margin-left: 120px;
}
.discipline {
  cursor: pointer;
  flex: 0 0 11%;
  /*margin-right: 1%;*/
}
.discipline .discipline-number {
  background-color: #D8D8D8;
  border: 1px solid #D8D8D8;
  flex: 0 0 1.85rem;
  font-size: 26pt;
  line-height: 32pt;
  margin: 0;
  padding: 0 4px;
  text-align: center;
  transition-property: background-color, color;
  transition-duration: 200ms;
  transition-timing-function: ease-out;
}
.discipline .discipline-name {
  border: 1px solid #D8D8D8;
  flex: 1 1 0;
  font-size: 12pt;
  margin: 0;
  padding: 3px;
  text-align: left;
  transition-property: background-color, color;
  transition-duration: 200ms;
  transition-timing-function: ease-out;
  min-width: 130px;
  max-width: 130px;
  white-space: pre-line;
}
.discipline .discipline-pointer {
  background: transparent url('../img/disc-ptr.png') 6.6667777% top no-repeat;
  height: 15px;
  opacity: 0;
  transition-property: opacity;
  transition-duration: 200ms;
  transition-timing-function: ease-out;
}
.discipline .discipline-status {
  border: solid #D8D8D8;
  border-width: 0 1px 1px 1px;
  text-align: center;
  padding: 4px;
  font-size: 10pt;
  text-transform: uppercase;
  font-weight: bold;
  min-width: 130px;
  max-width: 130px;
}
.discipline .discipline-status.status--ok {
  color: #3D9970;
}
.discipline .discipline-status.status--warning {
  color: #FF7700;
}
.discipline .discipline-info {
  border: solid #D8D8D8;
  border-width: 0 1px 1px 0;
  padding: 4px;
  font-size: 10pt;
}
.discipline .discipline-info .label {
  color: #6f6f6f;
}
.discipline .discipline-textarea {
  border-left: none 0;
  min-height: 45px;
  pointer-events: none;
}
.discipline .discipline-textarea.editable {
  pointer-events: all;
}
.discipline div.risk-info {
  border: solid #D8D8D8;
  border-width: 1px 1px 1px 0;
  padding-right: 8px;
}
.discipline table {
  width: 100%;
  border: solid #D8D8D8;
  border-width: 1px 0 1px 1px;
  border-spacing: 0;
  margin: 5px;
  color: #222;
  text-align: left;
  font-weight: normal;
  font-size: 10pt;
  white-space: nowrap;
}
.discipline th {
  font-weight: normal;
  border: solid #D8D8D8;
  border-width: 0 1px 0 0;
  background-color: #F0F0F0;
  padding-left: 3px;
}
.discipline td {
  font-weight: normal;
  border: solid #D8D8D8;
  border-width: 0 1px 0 0;
  padding-left: 3px;
}
.discipline .tab-label {
  width: 100%;
  margin: 5px 0 0 5px;
  font-size: 10pt;
}
.discipline .tab-placeholder {
  width: 100%;
  margin: 5px;
}
.discipline .discipline-img {
  border: 1px solid #D8D8D8;
  border-left: 0;
  padding: 4px;
}
.discipline .discipline-img img {
  width: 100%;
}
.rpn--na {
  color: #fff;
  background-color: gray;
}
.rpn--low {
  color: #fff;
  background-color: #3D9970;
}
.rpn--med {
  color: #111111;
  background-color: #FFDC00;
}
.rpn--high {
  color: #fff;
  background-color: #FF4136;
}
.discipline.selected .discipline-name,
.discipline.selected .discipline-number {
  background-color: #0074d9;
  border: 1px solid #0074d9;
  color: #ffffff;
}
.discipline.selected .discipline-number {
  text-shadow: 0 1px 1px #000000;
}
.discipline.selected .discipline-pointer {
  opacity: 1;
}
/*  #endregion  */
/* #region TEAM  */
.team_capa {
  margin: 0 55px 0 120px;
  padding: 0;
}
.team_capa h3 {
  font-size: 1.5em;
  margin: 0.67rem 0 0.15rem;
  padding: 0;
}
.team_capa p {
  font-size: 0.75rem;
  font-weight: 300;
  margin: 0.4rem 0;
}
/*.team*/
.list-of-members {
  background-color: #FFFFFF;
  border: 1px solid green;
  margin-bottom: 1rem;
  min-height: 40px;
}
.list-of-members-disabled {
  background-color: #fafafa;
  border: 1px solid #fafafa;
  margin-bottom: 1rem;
  min-height: 40px;
}
.team .team-member {
  color: black;
  cursor: pointer;
  padding: 2px 0 0;
  margin-bottom: 3px;
}
.team .team-member .team-member-name {
  flex: 1 1 auto;
}
.team .team-member .team-member-control {
  color: #ff4136;
  display: none;
  flex: 0 0 24px;
}
.team .team-member:hover {
  background-color: #0074d9;
  color: white;
}
.team .team-member:hover .team-member-control {
  display: block;
  flex: 0 0 24px;
}
.team .team-member-disabled {
  color: #c0c0c0;
}
.team .team-member-disabled:hover {
  color: #c0c0c0;
  background-color: #fafafa;
}
.unassigned-area {
  background-color: #FFFFFF;
  border: 1px solid #B22222;
  min-height: 39px;
}
.members .team-member,
.unassigned .team-member {
  cursor: pointer;
  font-size: 13px;
  height: 30px;
  margin: 0;
  padding: 5px 10px;
}
/* #endregion */
/* #region LEADERS */
.leaders {
  margin-bottom: 2rem;
}
.leader {
  border-bottom: 1px solid #DEDEDE;
  cursor: pointer;
  flex: 0 0 11%;
  font-size: 0.67rem;
  height: 32px;
  margin-right: 1%;
  padding: 8px 3px;
  transition: all 300ms ease;
}
.leader:hover {
  background-color: lemonchiffon;
}
/* #endregion */
/* #region TOPICS  */
.topic,
.problem {
  margin-left: 120px;
  padding-right: 120px;
}
.topic h3,
.problem h3 {
  font-size: 1.5em;
  margin: 0.67rem 0 0.67rem;
  padding: 0;
}
.capa-input-set {
  margin-top: 0.6rem;
  width: 95%;
}
.capa-cost,
.capa-label,
.capa-label-2 {
  height: 40px;
  line-height: 39px;
}
.capa-label {
  flex: 0 0 135px;
}
.capa-cost {
  border: 1px solid #ff4136;
  flex: 0 0 150px;
  font-size: 16px;
  max-width: 150px;
  padding-right: 3px;
  text-align: right;
}
.capa-input + .capa-label,
.capa-selector + .capa-label {
  margin-left: 5px;
  padding-left: 15px;
}
.capa-label-2 {
  flex: 0 0 30px;
  text-align: center;
}
.capa-input,
.capa-textarea {
  border: none;
  border-bottom: 1px solid #D3D3D3;
  height: 40px;
}
.capa-textarea {
  border: 1px solid #D3D3D3;
  margin-bottom: 0;
  min-height: 36px;
  max-height: 40px;
  padding-top: 6px;
  width: 95%;
}
.capa-textarea:focus {
  /*background-color: LemonChiffon;*/
  background-color: rgba(248, 244, 211, 0.72);
}
.capa-unit-1 {
  flex: 0 0 300px;
  max-width: 300px;
}
.capa-unit-2 {
  flex: 0 0 150px;
  max-width: 150px;
}
.capa-unit-3 {
  width: 240px;
}
/* #endregion */
/* #region DOCUMENTS */
.data.capa-id,
.heading.capa-id {
  flex: 0 0 100px;
  max-width: 100px;
  min-width: 100px;
  text-align: center;
}
.data.revision,
.heading.revision {
  flex: 0 0 40px;
  max-width: 40px;
  min-width: 40px;
  text-align: center;
}
.new-task-surface {
  padding-left: 63px;
}
.capa-documents-features,
.capa-tasks-features {
  font-size: 20px;
  font-weight: 300;
  margin: 4px 0 0;
  padding-left: 63px;
}
.capa-documents {
  margin-left: 63px;
}
.capa-documents .data.document {
  border-left: 1px solid #D1D1D1;
}
.capa-documents .data.account,
.capa-documents .heading.account {
  flex: 0 0 150px;
  min-width: 150px;
}
.capa-tasks {
  margin-left: 63px;
}
.capa-tasks .task-id {
  flex: 0 0 50px;
  max-width: 50px;
  min-width: 50px;
  text-align: center;
}
.capa-tasks .data.discipline,
.capa-tasks .heading.discipline {
  flex: 0 0 167px;
  max-width: 167px;
  margin: 0;
  min-width: 167px;
}
.capa-tasks .data.account,
.capa-tasks .heading.account {
  flex: 0 0 150px;
  min-width: 150px;
}
.capa-chart .label,
.capa-chart .value {
  font-size: 13pt;
  font-weight: 300;
  margin-right: 10px;
  height: 40px;
  line-height: 39px;
}
.capa-chart .feature {
  border: 2px solid #d8d8d8;
  /* @fog */
  height: 40px;
  line-height: 35px;
  margin-left: 10px;
  padding: 0 8px;
  transition: background-color 400ms ease;
  width: auto;
}
.capa-chart .value {
  border: none;
  border-bottom: 1px solid #0074d9;
  color: #0074d9;
  cursor: pointer;
}
.capa-chart input.value {
  width: 125px;
}
.capa-chart .value.not-selected {
  color: #D1D1D1;
  border-bottom: 1px solid white;
}
.capa-chart .chart-dates {
  margin-left: 20px;
}
/* #endregion */
/* #region NCR */
.ncr-commands-section {
  margin-left: 120px;
  margin-top: 30px;
  padding: 0 0 5px 0;
}
.ncr-disposition {
  margin-top: 0;
  border: 1px solid #DDDDDD;
  border-bottom: none;
}
.ncr-disposition .type,
.ncr-disposition .qty,
.ncr-disposition .notes {
  font-weight: 300;
  padding: 5px;
}
.ncr-disposition .type {
  background-color: #F3F3F3;
  border-bottom: 1px solid #DDDDDD;
  border-right: 1px solid #DDDDDD;
  flex: 0 0 15%;
  padding: 10px 5px;
}
.ncr-disposition .qty {
  padding-top: 10px;
}
.ncr-disposition .qty,
.ncr-disposition input.qty {
  border: none;
  border-bottom: 1px solid #DDDDDD;
  border-right: 1px solid #DDDDDD;
  flex: 0 0 15%;
  padding-right: 12px;
  text-align: right;
}
.ncr-disposition .notes,
.ncr-disposition input.notes {
  border: none;
  border-bottom: 1px solid #DDDDDD;
  flex: 0 0 70%;
  padding: 5px 12px;
}
.ncr-disposition .heading.type,
.ncr-disposition .heading.qty,
.ncr-disposition .heading.notes {
  background-color: #FFF;
  border: none;
  border-right: 1px solid #DDDDDD;
  border-bottom: 1px solid #DDDDDD;
  font-weight: 400;
  padding: 5px;
}
.ncr-disposition .heading.notes {
  border-right: none;
}
.ncr-disposition .detail.type {
  line-height: 40px;
}
.ncr-disposition .qty input,
.ncr-disposition .notes input {
  border: 0;
}
.ncr-disposition .qty input {
  text-align: right;
}
.ncr-textarea {
  width: 95%;
}
/* #endregion */
/* #region CAPAS TABLE */
.enterprise-grid.capas {
  padding-left: 120px;
}
.enterprise-grid.capas .data.discipline,
.enterprise-grid.capas .heading.discipline {
  flex: 0 0 175px;
  margin: 0;
}
/* #endregion */
/* #region HELP */
.pane--capa-help {
  background-color: #F9F9F9;
  border-left: 1px solid #d8d8d8;
  border-top: 1px solid #d8d8d8;
  max-width: 30%;
  min-width: 30%;
  padding-bottom: 30px;
}
.pane--capa-help .pane-title {
  background-color: #454545;
  color: #FFFFFF;
  font-size: 16px;
  height: 50px;
  line-height: 46px;
  margin: 0;
  padding: 3px 10px;
}
.pane--capa-help p {
  font-size: 13px;
  margin-bottom: 5px;
  margin: 0;
  padding: 10px;
}
.pane--capa-help hr {
  margin: 0.3333rem 0;
}
.pane--capa-help h1,
.pane--capa-help h2,
.pane--capa-help h3,
.pane--capa-help ol,
.pane--capa-help ul {
  font-size: 13px;
  margin-top: 5px;
  margin: 0;
  padding: 0 10px;
}
.pane--capa-help h1 {
  font-size: 16px;
  font-weight: bold;
  margin-top: 0.3rem;
}
.pane--capa-help h2 {
  font-size: 14px;
  font-weight: bold;
}
.pane--capa-help h3 {
  color: #444;
  font-size: 14px;
}
.pane--capa-help ol,
.pane--capa-help ul {
  margin-left: 25px;
}
/* #endregion */
/* #region  */
/*  ---  MAX : @dimension is ( less than | equal to )      @value ------------- */
/*  ---  MIN : @dimension is ( greater than | equal to )   @value ------------- */
/*  TABLE HEIGHT :: RowHeight (30px)
*/
/*  #region  HOME  */
.app-container.home,
.app-container.setup {
  overflow: hidden;
  width: 85%;
}
.app-container.home_tabs {
  overflow: hidden;
  width: 95%;
}
.app-container.home_tabs .home-tab,
.app-container.home_tabs .home-sep {
  font-weight: 400;
  color: #AAAAAA;
}
.app-container.home_tabs .home-tab.current {
  font-weight: 600;
  /*color: #444444;*/
  color: #0074d9;
  /*font-size: 24px;*/
  /*text-decoration: underline;*/
}
.app-container.home_tabs .home-sep {
  height: 40px;
  line-height: 35px;
  padding: 0 8px;
  margin-left: 10px;
}
.tiles {
  margin-left: 120px;
}
.tiles .tile {
  background-color: #222222;
  border: 6px solid #ffffff;
  color: #ffffff;
  cursor: pointer;
  font-size: 30px;
  font-weight: 300;
  height: 10rem;
  margin-right: 1rem;
  margin-top: 1rem;
  min-width: 110px;
  padding: 5px 10px;
  position: relative;
  transition: border-color 400ms ease;
  width: 10rem;
}
.tiles .tile:hover {
  border: 6px solid #0074d9;
}
.tiles .tile.plan {
  background-color: #0082f3;
}
.tiles .tile.plan .count {
  background-color: #006cca;
}
.tiles .tile.plan .count:hover {
  background-color: #00539c;
}
.tiles .tile.fai {
  background-color: #85144B;
}
.tiles .tile.fai .count {
  background-color: #6f113f;
}
.tiles .tile.fai .count:hover {
  background-color: #430a26;
}
.tiles .tile.inspection {
  background-color: #3D9970;
}
.tiles .tile.inspection .count {
  background-color: #368763;
}
.tiles .tile.inspection .count:hover {
  background-color: #276248;
}
.tiles .tile.ncr {
  /* red */
  background-color: #B22222;
  color: white;
}
.tiles .tile.ncr .count {
  background-color: #8E1B1B;
  color: white;
}
.tiles .tile.ncr .count:hover {
  background-color: #721616;
  color: white;
}
.tiles .tile.capa {
  /* brown */
  background-color: #B64925;
  color: white;
}
.tiles .tile.capa .count {
  background-color: #923a1e;
  color: white;
}
.tiles .tile.capa .count:hover {
  background-color: #752e18;
  color: white;
}
.tiles .tile.audit {
  /* yellow */
  background-color: #ffc710;
  color: white;
}
.tiles .tile.audit .count {
  background-color: #d9a200;
  color: white;
}
.tiles .tile.audit .count:hover {
  background-color: #AE8200;
  color: white;
}
.tiles .tile.scar {
  /* orange */
  background-color: #FF851B;
  color: white;
}
.tiles .tile.scar .count {
  background-color: #e26900;
  color: white;
}
.tiles .tile.scar .count:hover {
  background-color: #b55400;
  color: white;
}
.tiles .tile.complaint {
  /* orange */
  background-color: #FF851B;
  color: white;
  padding: 5px;
}
.tiles .tile.complaint .count {
  background-color: #e26900;
  color: white;
}
.tiles .tile.complaint .count:hover {
  background-color: #b55400;
  color: white;
}
.tiles .tile.document {
  background-color: #85144B;
  color: white;
  padding: 5px;
}
.tiles .tile.document .count {
  background-color: #6f113f;
}
.tiles .tile.document .count:hover {
  background-color: #430a26;
}
.tiles .tile.task {
  background-color: #323232;
}
.tiles .tile.task .count {
  background-color: #272127;
}
.tiles .tile.task .count:hover {
  background-color: #010101;
}
.tiles .tile.ppap {
  background-color: #39CCCC;
}
.tiles .tile.ppap .count {
  background-color: #4bb9b9;
}
.tiles .tile.ppap .count:hover {
  background-color: #289b9b;
}
.tiles .tile.gages {
  /* violet */
  background-color: #762591;
  color: white;
}
.tiles .tile.gages .count {
  background-color: #8e4ca3;
  color: white;
}
.tiles .tile.gages .count:hover {
  background-color: #601078;
  color: white;
}
.tiles .tile.avl {
  background-color: #b8860b;
}
.tiles .tile.avl .count {
  background-color: #a1833c;
}
.tiles .tile.avl .count:hover {
  background-color: #a1833c;
}
.tiles .tile.darkgreen {
  background-color: #015d2d;
}
.tiles .tile.darkgreen .count {
  background-color: #013a1c;
}
.tiles .tile.darkgreen .count:hover {
  background-color: #001209;
}
.tiles .tile.darkblue {
  background-color: #00539c;
}
.tiles .tile.darkblue .count {
  background-color: #003e75;
}
.tiles .tile.darkblue .count:hover {
  background-color: #003e75;
}
.tiles .tile.aqua {
  background-color: #87ceeb;
}
.tiles .tile.aqua .count {
  background-color: #1fc0ff;
}
.tiles .tile.aqua .count:hover {
  background-color: #1fc0ff;
}
.tiles .tile.silver {
  background-color: #a5a5a5;
}
.tiles .tile.silver .count {
  background-color: #7b7b7b;
}
.tiles .tile.silver .count:hover {
  background-color: #7b7b7b;
}
.tiles .tile.pink {
  background-color: #f88fa7;
}
.tiles .tile.pink .count {
  background-color: #f08080;
}
.tiles .tile.pink .count:hover {
  background-color: #f08080;
}
.tiles .tile.coral {
  background-color: #ff7f50;
}
.tiles .tile.coral .count {
  background-color: #fb4300;
}
.tiles .tile.coral .count:hover {
  background-color: #fb4300;
}
.tiles .count,
.tiles .legend {
  bottom: 0;
  font-size: 10px;
  line-height: 20px;
  padding: 5px;
  position: absolute;
  text-transform: uppercase;
  width: 50%;
  text-align: center;
}
.tiles .count span {
  font-size: 22px;
}
.tiles .count.shared {
  left: 0;
}
.tiles .count.total {
  right: 0;
}
.tiles .count.top-left {
  bottom: 55px;
  left: 0;
  padding-bottom: 0;
}
.tiles .count.top-right {
  bottom: 55px;
  right: 0;
  padding-bottom: 0;
}
.tiles .legend {
  width: 90%;
  text-align: left;
}
/* #endregion */
/*  #region  DASHBOARD  */
.feature.reapply-filters {
  border-color: #FF851B !important;
  color: #FF851B;
}
.feature.reapply-filters:hover {
  border-color: #FF851B !important;
  background-color: #FF851B !important;
  color: #000;
}
.feature.filters-applied {
  border-color: #3D9970 !important;
  color: #3D9970;
}
.filters {
  margin-bottom: 10px;
}
.filters .label,
.filters .value {
  font-size: 13pt;
  font-weight: 300;
  margin-right: 10px;
  height: 40px;
  line-height: 39px;
}
.filters .feature {
  border: 2px solid #d8d8d8;
  /* @fog */
  height: 40px;
  line-height: 35px;
  margin-left: 10px;
  padding: 0 8px;
  transition: background-color 400ms ease;
  width: auto;
}
.filters .value {
  border: none;
  border-bottom: 1px solid #0074d9;
  color: #0074d9;
  cursor: pointer;
}
.filters input.value {
  width: 125px;
}
.filters .value.not-selected {
  color: #D1D1D1;
  border-bottom: 1px solid white;
}
.filters .last {
  margin-right: 1.3333vw;
}
.filters select,
.filters select:active,
.filters select:focus {
  outline: none;
  padding-right: 20px;
}
.cards {
  height: 0px;
  overflow-y: scroll;
  overflow-x: hidden;
  padding-left: 120px;
  width: 100vw;
}
.card-group {
  margin-top: 1.5rem;
  min-height: 1rem;
}
.card {
  background-color: #FFFFFF;
  height: 290px;
  margin-right: 0.33vw;
  padding: 10px 0;
  width: 360px;
  /* width: 31.03448275862069vw; */
}
.card.last {
  margin-right: 0;
}
.card--heading {
  cursor: default;
  margin: 0;
  height: 60px;
  width: 340px;
}
.card--heading-logo {
  max-height: 60px;
  max-width: 60px;
}
.card--heading-logo img,
.card--heading-logo .image {
  background-position: center 25%;
  background-repeat: no-repeat;
  background-size: 60px;
  height: 60px;
  width: 60px;
}
.card--heading-title,
.card--heading-subtitle {
  font-size: 18pt;
  line-height: 20pt;
  max-width: 340px;
  padding: 5px 6px 3px 0px;
}
.card--heading-subtitle {
  font-size: 11pt;
  font-weight: 300;
  line-height: 12pt;
  padding-top: 0;
}
/* Handle cases where there-is / there-is-not a supplier logo image */
.card--heading-logo + .card--heading-text .card--heading-title,
.card--heading-logo + .card--heading-text .card--heading-subtitle {
  padding-left: 10px;
  max-width: 280px;
}
.card--body {
  cursor: pointer;
  height: 200px;
  width: 340px;
}
.card--body .column {
  width: 140px;
}
.card--body .chart--wheel {
  border-bottom: 1px solid #d7d7d7;
  height: 200px;
  margin: 0;
  padding: 0;
  width: 200px;
}
.card--body .table--tally {
  height: 120px;
}
.card--body .chart--history {
  border-bottom: 1px solid #d7d7d7;
  height: 80px;
  margin: 0;
  padding: 0;
  width: 140px;
}
.card--body .row {
  margin-bottom: 2px;
  margin-left: 2px;
}
.card--body .row .label,
.card--body .row .value {
  display: inline-block;
  font-size: 15px;
  font-weight: 300;
  height: inherit;
  line-height: inherit;
  margin-right: 0;
}
.card--body .row .label a {
  color: #0074D9;
  text-decoration: none;
}
.card--body .row .label a:hover {
  text-decoration: underline;
}
.card--body .row .value {
  border-bottom: none;
  font-weight: 400;
  text-align: right;
}
.card--body .row.latest {
  border-bottom: 1px solid #d7d7d7;
  margin-bottom: 4px;
  padding-bottom: 1px;
}
.card--footing {
  width: 340px;
}
.card--footing-count {
  padding: 2px 8px;
  font-weight: 300;
  font-size: 12px;
  background-color: #d7d7d7;
}
.standalone-card .card-group {
  margin-top: 0;
}
.standalone-card .card {
  height: auto;
}
/* #endregion */
.autocomplete {
  background-color: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.3);
  position: absolute;
  z-index: 11000;
  overflow-y: scroll;
  height: 300px;
  display: none;
  cursor: pointer;
}
.autocomplete div.method {
  padding: 5px 0px 5px 5px;
}
.autocomplete div.selected {
  background-color: #ff8b26;
}
/* add ons to main screens */
/* onboarding page */
.display-only {
  border: none;
  border-bottom: 1px solid #EEE;
}
span.acceptance {
  padding-left: 20px;
  font-size: 11pt;
  line-height: 28pt;
}
.qq-uploader {
  max-height: 400px;
  overflow-y: auto;
}
/* read only input - need to be after capa.css */
.disabled-input {
  color: #808080 /*#5d5d5d*/;
  background-color: #fcfcfc;
  border: 1px solid #dcdcdc;
}
.system-input {
  color: #808080;
  background-color: #f0f8ff;
  border: 1px solid #dcdcdc;
}
/*  #region  MODAL  */
.modal {
  z-index: 2502;
}
.modal.scrim {
  background-color: #000000;
  height: 100%;
  left: 0;
  opacity: 0.33;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 2500;
}
.modal.animated.content {
  -moz-animation-duration: 300ms;
  -ms-animation-duration: 300ms;
  -webkit-animation-duration: 300ms;
  background-color: #001f3f;
  color: #ffffff;
  font-size: 12pt;
  min-height: 225px;
  position: absolute;
  top: 30%;
  width: 100%;
  z-index: 2501;
}
.modal.animated.content h1,
.modal.animated.content h2,
.modal.animated.content h3,
.modal.animated.content h4,
.modal.animated.content p,
.modal.animated.content label,
.modal.animated.content textarea {
  color: #ffffff;
  margin-left: 15%;
}
.modal.animated.content h1,
.modal.animated.content h2 {
  padding: 30px 0px 5px 0px;
}
.modal.animated.content p,
.modal.animated.content label {
  color: #EDEDED;
  font-size: 0.9em;
  margin-top: 0.25rem;
}
.modal.animated.content textarea {
  color: #000000;
  width: 70%;
}
.modal.animated.content .group {
  text-align: center;
  margin: 30px 0;
}
.modal.animated.content .group button {
  border: 1px solid #ffffff;
  color: #ffffff;
  font-size: 0.9em;
  font-weight: 400;
  margin: 0 0.35em;
  padding: 0.35em 1em;
  width: 135px;
}
.modal.animated.content .group button:hover {
  cursor: pointer;
}
.modal.content.alert {
  background: #910000 url(../img/icons/delete_circle_filled.svg) no-repeat -25px -25px;
  background-size: 160px 160px;
}
.modal.content.alert button {
  background-color: #af0000;
}
.modal.content.alert button:hover {
  background-color: #c80000;
}
.modal.content.confirm,
.modal.content.inform {
  background: #0074d9 url(../img/icons/question_circle_filled.svg) no-repeat -25px -25px;
  background-size: 160px 160px;
}
.modal.content.confirm button,
.modal.content.inform button {
  background-color: #108ffe;
}
.modal.content.confirm button:hover,
.modal.content.inform button:hover {
  background-color: #53aefe;
}
.modal.content.inform {
  background: #0074d9 url(../img/icons/inform_circle_filled.svg) no-repeat -25px -25px;
  background-size: 160px 160px;
}
.modal.content.success {
  background: #004400 url(../img/icons/check_circle_filled.svg) no-repeat -25px -25px;
  background-size: 160px 160px;
}
.modal.content.success button {
  background-color: #006200;
}
.modal.content.success button:hover {
  background-color: #007600;
}
/* #endregion */
#js-ide-matrix.grid--matrix {
  padding: 0;
}
#js-ide-matrix {
  border-bottom: 2px solid #232323;
  margin: 0 0 0 50px;
}
#js-ide-matrix .guidance {
  background-color: rgba(240, 255, 255, 0.67);
  /* #F0FFFF */
}
#js-ide-matrix .colHeader,
#js-ide-matrix .colHeadRow {
  display: flex;
}
#js-ide-matrix .colHead {
  flex: 0 0 auto;
}
#js-ide-matrix .colHeader {
  cursor: pointer;
  flex-direction: column;
}
#js-ide-matrix .colHeadRow {
  background-color: #FFF;
  flex-direction: row;
}
#js-ide-matrix table,
#js-ide-matrix thead,
#js-ide-matrix thead tr,
#js-ide-matrix thead tr th,
#js-ide-matrix thead tr td,
#js-ide-matrix thead tr th .relative,
#js-ide-matrix thead tr th .colHeader,
#js-ide-matrix thead tr th .colHead,
#js-ide-matrix thead tr th .colHeadRow,
#js-ide-matrix .handsontable table,
#js-ide-matrix .handsontable tbody,
#js-ide-matrix .handsontable thead,
#js-ide-matrix .handsontable td,
#js-ide-matrix .handsontable th,
#js-ide-matrix .handsontable input,
#js-ide-matrix .handsontable textarea,
#js-ide-matrix .handsontable div,
#js-ide-matrix .spec-number,
#js-ide-matrix .feature,
#js-ide-matrix .tolerance,
#js-ide-matrix .spec-type,
#js-ide-matrix .method-sampling,
#js-ide-matrix .work-instructions,
#js-ide-matrix .no-work-instructions,
#js-ide-matrix .drawing-detail,
#js-ide-matrix .no_drawing-detail,
#js-ide-matrix .drawing-link,
#js-ide-matrix .no_drawing-link {
  box-sizing: border-box !important;
  -webkit-box-sizing: border-box !important;
}
#js-ide-matrix thead div.relative {
  padding: 0;
}
#js-ide-matrix thead tr th:first-child {
  background-color: #F0F0F0;
  height: 71px !important;
}
#js-ide-matrix tbody div.relative,
#js-ide-matrix tbody tr,
#js-ide-matrix tbody tr th,
#js-ide-matrix tbody tr td {
  height: 30px;
  line-height: 29px;
}
#js-ide-matrix tbody td.guidance.current.highlight,
#js-ide-matrix tbody td.current.highlight {
  background-color: #FFFFFF;
}
#js-ide-matrix .bonus-tolerance,
#js-ide-matrix .feature,
#js-ide-matrix .method-sampling,
#js-ide-matrix .no-work-instructions,
#js-ide-matrix .serial-number,
#js-ide-matrix .spec-number,
#js-ide-matrix .tolerance,
#js-ide-matrix .work-instructions,
#js-ide-matrix .drawing-link,
#js-ide-matrix .no_drawing-link {
  font-weight: 600;
}
#js-ide-matrix .bonus-tolerance,
#js-ide-matrix .serial-number,
#js-ide-matrix .spec-number {
  font-size: 13px;
}
#js-ide-matrix .spec-type {
  font-weight: 400;
  font-size: 11px;
}
#js-ide-matrix .spec-number.bonus-tolerance {
  min-width: 35px;
  max-width: 35px;
}
#js-ide-matrix .bonus-tolerance,
#js-ide-matrix .feature,
#js-ide-matrix .method-sampling,
#js-ide-matrix .no-work-instructions,
#js-ide-matrix .serial-number,
#js-ide-matrix .spec-number,
#js-ide-matrix .spec-type,
#js-ide-matrix .tolerance,
#js-ide-matrix .work-instructions,
#js-ide-matrix .drawing-link,
#js-ide-matrix .no_drawing-link {
  height: 36px;
  /* fix for traceability (was 35 before), seems to work fine for the inspection matrix as well */
  line-height: 34px;
}
#js-ide-matrix .bonus-tolerance,
#js-ide-matrix .serial-number,
#js-ide-matrix .method-sampling,
#js-ide-matrix .tolerance {
  color: #111;
  overflow: hidden;
}
#js-ide-matrix .bonus-tolerance,
#js-ide-matrix .serial-number {
  flex: 1 1 35px;
  padding: 0 2px;
  text-align: center;
}
#js-ide-matrix .method-sampling,
#js-ide-matrix .tolerance {
  flex: 1 1 auto;
  font-size: 12.25px;
  padding-left: 5px;
  text-align: left;
  text-overflow: ellipsis;
}
#js-ide-matrix .bonus-tolerance.lower,
#js-ide-matrix .serial-number.lower,
#js-ide-matrix .method-sampling {
  background-color: #FFF;
  border-bottom: 1px solid black;
  padding-right: 2px;
}
#js-ide-matrix .feature,
#js-ide-matrix .no-work-instructions,
#js-ide-matrix .spec-number,
#js-ide-matrix .spec-type,
#js-ide-matrix .tolerance,
#js-ide-matrix .work-instructions,
#js-ide-matrix .drawing-link,
#js-ide-matrix .no_drawing-link {
  min-width: 35px;
}
#js-ide-matrix .method-sampling {
  min-width: 20px;
  width: 50%;
  text-align: center;
}
#js-ide-matrix .method-sampling.sampling {
  border-left: 1px solid #cccccc;
}
#js-ide-matrix .bonus-tolerance,
#js-ide-matrix .feature,
#js-ide-matrix .serial-number,
#js-ide-matrix .tolerance {
  border-bottom: 1px solid #cccccc;
}
#js-ide-matrix .spec-number,
#js-ide-matrix .spec-type {
  color: #FFF;
}
#js-ide-matrix .spec-number,
#js-ide-matrix .spec-number.bonus-tolerance {
  background-color: #111;
}
#js-ide-matrix .spec-type {
  background-color: #676767;
  border: 1px solid #676767;
  border-bottom: 1px solid black;
}
#js-ide-matrix .bonus-tolerance,
#js-ide-matrix .serial-number {
  background-color: #FAFAFA;
  text-transform: uppercase;
}
#js-ide-matrix .tolerance {
  background-color: #FAFAFA;
}
#js-ide-matrix .no-work-instructions,
#js-ide-matrix .work-instructions {
  /*border-bottom: 1px solid black;*/
  border-bottom: 1px solid #cccccc;
  background-color: #FAFAFA;
  border-left: 1px solid #cccccc;
}
#js-ide-matrix .handsontable td.htDimmed {
  background-color: #F3F3F3;
  background-color: rgba(247, 247, 247, 0.7);
  cursor: not-allowed;
  color: #424242;
}
#js-ide-matrix .handsontable td.listbox.htDimmed {
  cursor: pointer;
}
#js-ide-matrix .handsontable td.listbox.htDimmed:hover {
  background-color: #ff851b;
}
#js-ide-matrix .feature-symbol {
  flex: 0 0 35px;
  width: 35px;
  border-bottom: 1px solid #cccccc;
}
#js-ide-matrix .feature-symbol.none-icon {
  display: none;
  visibility: hidden;
}
#js-ide-matrix .feature-symbol.angle-icon {
  background: white url('../img/svg/angle.svg') no-repeat center 3px;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.angularity-icon {
  background: white url('../img/svg/angularity.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.chamfer-icon {
  background: white url('../img/svg/chamfer.svg') no-repeat 5px 1px;
  background-size: 28px;
}
#js-ide-matrix .feature-symbol.circularity-icon {
  background: white url('../img/svg/circularity.svg') no-repeat center center;
  background-size: 24px;
}
#js-ide-matrix .feature-symbol.circular-runout-icon {
  background: white url('../img/svg/circular_runout.svg') no-repeat center center;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.concentricity-icon {
  background: white url('../img/svg/concentricity.svg') no-repeat center center;
  background-size: 24px;
}
#js-ide-matrix .feature-symbol.counterbore-icon {
  background: white url('../img/svg/counterbore.svg') no-repeat 5px 0;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.countersink-icon {
  background: white url('../img/svg/countersink.svg') no-repeat center center;
  background-size: 28px;
}
#js-ide-matrix .feature-symbol.cylindricity-icon {
  background: white url('../img/svg/cylindricity.svg') no-repeat center center;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.depth-icon {
  background: white url('../img/svg/depth.svg') no-repeat 5px 3px;
  background-size: 28px;
}
#js-ide-matrix .feature-symbol.diameter-icon {
  background: white url('../img/svg/diameter.svg') no-repeat center center;
  background-size: 24px;
}
#js-ide-matrix .feature-symbol.flatness-icon {
  background: white url('../img/svg/flatness.svg') no-repeat center 60%;
  background-size: 24px;
}
#js-ide-matrix .feature-symbol.linear-dimension-icon,
#js-ide-matrix .feature-symbol.length-icon,
#js-ide-matrix .feature-symbol.distance-icon,
#js-ide-matrix .feature-symbol.width-icon {
  background: white url('../img/svg/linear_dimension.svg') no-repeat center center;
  background-size: 28px;
}
#js-ide-matrix .feature-symbol.line-profile-icon {
  background: white url('../img/svg/line_profile.svg') no-repeat center center;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.parallelism-icon {
  background: white url('../img/svg/parallelism.svg') no-repeat 4px 3px;
  background-size: 28px;
}
#js-ide-matrix .feature-symbol.perpendicularity-icon {
  background: white url('../img/svg/perpendicularity.svg') no-repeat center center;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.position-icon {
  background: white url('../img/svg/position.svg') no-repeat no-repeat 5px 4px;
  background-size: 26px;
}
#js-ide-matrix .feature-symbol.position-diametric-icon {
  background: white url('../img/svg/position_diametric.svg') no-repeat no-repeat 3px 3px;
  background-size: 32px;
}
#js-ide-matrix .feature-symbol.position-spherical-icon {
  background: white url('../img/svg/position_spherical.svg') no-repeat no-repeat 2px 7px;
  background-size: 33px;
}
#js-ide-matrix .feature-symbol.radius-icon {
  background: white url('../img/svg/radius.svg') no-repeat no-repeat 5px 6px;
  background-size: 20px;
}
#js-ide-matrix .feature-symbol.surface-roughness-icon {
  background: white url('../img/svg/surface_roughness.svg') no-repeat center center;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.spherical-diameter-icon {
  background: white url('../img/svg/spherical_diameter.svg') no-repeat no-repeat 0px 0px;
  background-size: 33px;
}
#js-ide-matrix .feature-symbol.spherical-radius-icon {
  background: white url('../img/svg/spherical_radius.svg') no-repeat no-repeat 3px 2px;
  background-size: 31px;
}
#js-ide-matrix .feature-symbol.straightness-icon {
  background: white url('../img/svg/straightness.svg') no-repeat center center;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.surface-profile-icon {
  background: white url('../img/svg/surface_profile.svg') no-repeat no-repeat 5px 3px;
  background-size: 32px;
}
#js-ide-matrix .feature-symbol.symmetry-icon {
  background: white url('../img/svg/symmetry.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.tap-depth-icon {
  background: white url('../img/svg/tap_depth.svg') no-repeat 3px 3px;
  background-size: 28px;
}
#js-ide-matrix .feature-symbol.tap-diameter-icon {
  background: white url('../img/svg/tap_diameter.svg') no-repeat 3px 3px;
  background-size: 28px;
}
#js-ide-matrix .feature-symbol.taper-icon {
  background: white url('../img/svg/taper.svg') no-repeat center center;
  background-size: 30px;
}
#js-ide-matrix .feature-symbol.thread-icon {
  background: white url('../img/svg/thread.svg') no-repeat center center;
  background-size: 24px;
}
#js-ide-matrix .feature-symbol.thread-depth-icon {
  background: white url('../img/svg/thread_depth.svg') no-repeat 5px 6px;
  background-size: 24px;
}
#js-ide-matrix .feature-symbol.total-runout-icon {
  background: white url('../img/svg/total_runout.svg') no-repeat 3px 3px;
  background-size: 30px;
}
.work-instructions {
  background: white url('../img/icons/column-wrench.svg') no-repeat center center;
  background-size: 24px;
  color: transparent;
  transition: all 250ms ease-in-out;
}
.no-work-instructions {
  background: white url('../img/icons/column-wrench-na.svg') no-repeat center center;
  background-size: 24px;
  color: transparent;
  cursor: not-allowed;
}
.work-instructions:hover {
  background: #0074d9 url('../img/icons/column-wrench-hover.svg') no-repeat center center;
  background-size: 24px;
  cursor: pointer;
}
.drawing-detail,
.no-drawing-detail {
  display: table-cell;
  text-align: center;
}
.drawing-detail,
.drawing-link {
  color: black;
}
.no-drawing-link,
.no-drawing-detail {
  color: lightgrey;
  cursor: not-allowed;
}
.drawing-link:hover,
.drawing-detail:hover {
  background: #0074d9;
  cursor: pointer;
}
.drawing-link,
.no-drawing-link {
  font-size: 22px !important;
}
#js-ide-spec.grid--matrix {
  padding: 0;
}
#js-ide-spec {
  border-bottom: 2px solid #232323;
  margin: 0 0 0 50px;
}
#js-ide-spec .charts {
  border-top: 1px solid #D8D8D8;
}
#js-ide-spec .guidance {
  background-color: rgba(240, 255, 255, 0.67);
  /* #F0FFFF */
}
#js-ide-spec .handsontable thead th {
  background-color: #F0F0F0;
  color: black;
  font-weight: 400;
  font-size: 9pt;
  height: 29px !important;
}
#js-ide-spec .handsontable tbody th.ht__highlight,
#js-ide-spec .handsontable thead th.ht__highlight {
  background-color: #DBD8D8;
}
#js-ide-spec .handsontable td.htDimmed {
  background-color: #F3F3F3;
  background-color: rgba(247, 247, 247, 0.7);
  cursor: not-allowed;
  color: #424242;
}
#js-ide-spec .handsontable tbody tr td {
  height: 30px;
  line-height: 29px;
}
#js-ide-spec.serialized #js-ide-table {
  min-width: 410px;
}
#js-ide-spec.unserialized #js-ide-table {
  min-width: 261px;
}
.unit.whole.sub-keys,
.unit.whole.sub-keys .key {
  background-color: #FFF;
}
.sub-keys .feature-symbol {
  flex: 0 0 50px;
  width: 50px;
}
.sub-keys .feature-symbol.none-icon {
  display: none;
  visibility: hidden;
}
.sub-keys .feature-symbol.angle-icon {
  background: white url('../img/svg/angle.svg') no-repeat center center;
  background-size: 35px;
}
.sub-keys .feature-symbol.angularity-icon {
  background: white url('../img/svg/angularity.svg') no-repeat center center;
  background-size: 35px;
}
.sub-keys .feature-symbol.chamfer-icon {
  background: white url('../img/svg/chamfer.svg') no-repeat center center;
  background-size: 35px;
}
.sub-keys .feature-symbol.circularity-icon {
  background: white url('../img/svg/circularity.svg') no-repeat center center;
  background-size: 33px;
}
.sub-keys .feature-symbol.circular-runout-icon {
  background: white url('../img/svg/circular_runout.svg') no-repeat center center;
  background-size: 34px;
}
.sub-keys .feature-symbol.concentricity-icon {
  background: white url('../img/svg/concentricity.svg') no-repeat center center;
  background-size: 33px;
}
.sub-keys .feature-symbol.counterbore-icon {
  background: white url('../img/svg/counterbore.svg') no-repeat center center;
  background-size: 36px;
}
.sub-keys .feature-symbol.countersink-icon {
  background: white url('../img/svg/countersink.svg') no-repeat center center;
  background-size: 36px;
}
.sub-keys .feature-symbol.cylindricity-icon {
  background: white url('../img/svg/cylindricity.svg') no-repeat center center;
  background-size: 36px;
}
.sub-keys .feature-symbol.depth-icon {
  background: white url('../img/svg/depth.svg') no-repeat center center;
  background-size: 35px;
}
.sub-keys .feature-symbol.diameter-icon {
  background: white url('../img/svg/diameter.svg') no-repeat center center;
  background-size: 32px;
}
.sub-keys .feature-symbol.flatness-icon {
  background: white url('../img/svg/flatness.svg') no-repeat center 40%;
  background-size: 34px;
}
.sub-keys .feature-symbol.line-profile-icon {
  background: white url('../img/svg/line_profile.svg') no-repeat center center;
  background-size: 36px;
}
.sub-keys .feature-symbol.linear-dimension-icon,
.sub-keys .feature-symbol.length-icon,
.sub-keys .feature-symbol.distance-icon,
.sub-keys .feature-symbol.width-icon {
  background: white url('../img/svg/linear_dimension.svg') no-repeat center center;
  background-size: 32px;
}
.sub-keys .feature-symbol.parallelism-icon {
  background: white url('../img/svg/parallelism.svg') no-repeat center center;
  background-size: 32px;
}
.sub-keys .feature-symbol.perpendicularity-icon {
  background: white url('../img/svg/perpendicularity.svg') no-repeat center center;
  background-size: 32px;
}
.sub-keys .feature-symbol.position-icon {
  background: white url('../img/svg/position.svg') no-repeat center center;
  background-size: 26px;
}
.sub-keys .feature-symbol.position-diametric-icon {
  background: white url('../img/svg/position_diametric.svg') no-repeat center center;
  background-size: 32px;
}
.sub-keys .feature-symbol.position-spherical-icon {
  background: white url('../img/svg/position_spherical.svg') no-repeat center center;
  background-size: 33px;
}
.sub-keys .feature-symbol.radius-icon {
  background: white url('../img/svg/radius.svg') no-repeat center center;
  background-size: 22px;
}
.sub-keys .feature-symbol.surface-roughness-icon {
  background: white url('../img/svg/surface_roughness.svg') no-repeat center center;
  background-size: 34px;
}
.sub-keys .feature-symbol.spherical-diameter-icon {
  background: white url('../img/svg/spherical_diameter.svg') no-repeat center center;
  background-size: 32px;
}
.sub-keys .feature-symbol.spherical-radius-icon {
  background: white url('../img/svg/spherical_radius.svg') no-repeat center center;
  background-size: 32px;
}
.sub-keys .feature-symbol.straightness-icon {
  background: white url('../img/svg/straightness.svg') no-repeat center center;
  background-size: 34px;
}
.sub-keys .feature-symbol.surface-profile-icon {
  background: white url('../img/svg/surface_profile.svg') no-repeat center center;
  background-size: 32px;
}
.sub-keys .feature-symbol.symmetry-icon {
  background: white url('../img/svg/symmetry.svg') no-repeat center center;
  background-size: 32px;
}
.sub-keys .feature-symbol.tap-depth-icon {
  background: white url('../img/svg/tap_depth.svg') no-repeat center center;
  background-size: 24px;
}
.sub-keys .feature-symbol.tap-diameter-icon {
  background: white url('../img/svg/tap_diameter.svg') no-repeat center top;
  background-size: 24px;
}
.sub-keys .feature-symbol.taper-icon {
  background: white url('../img/svg/taper.svg') no-repeat center center;
  background-size: 34px;
}
.sub-keys .feature-symbol.thread-icon {
  background: white url('../img/svg/thread.svg') no-repeat center center;
  background-size: 30px;
}
.sub-keys .feature-symbol.thread-depth-icon {
  background: white url('../img/svg/thread_depth.svg') no-repeat center center;
  background-size: 24px;
}
.sub-keys .feature-symbol.total-runout-icon {
  background: white url('../img/svg/total_runout.svg') no-repeat center center;
  background-size: 32px;
}
#js-ide-part.grid--matrix {
  padding: 0;
}
#js-ide-part.fai {
  margin-left: 120px;
  margin-top: 15px;
}
#js-ide-part {
  border-bottom: 2px solid #232323;
  margin: 0 0 0 50px;
}
#js-ide-part .guidance {
  background-color: rgba(240, 255, 255, 0.67);
  /* #F0FFFF */
}
#js-ide-part .handsontable thead th {
  background-color: #F0F0F0;
  color: black;
  font-weight: 400;
  font-size: 9pt;
  height: 29px !important;
}
#js-ide-part .handsontable tbody th.ht__highlight,
#js-ide-part .handsontable thead th.ht__highlight {
  background-color: #DBD8D8;
}
#js-ide-part .handsontable td.feature-composite {
  padding-left: 45px;
}
#js-ide-part .handsontable td.feature-composite.none-icon {
  padding-left: 5px;
}
#js-ide-part .handsontable td.htDimmed {
  background-color: #F3F3F3;
  background-color: rgba(247, 247, 247, 0.7);
  cursor: not-allowed;
  color: #424242;
}
#js-ide-part table.htCore tbody tr {
  height: 29px;
}
#js-ide-part .handsontable input.htHeaderCheckboxInput {
  vertical-align: middle;
  height: 1em;
  width: 40%;
  margin-right: 3px;
}
#js-ide-part .feature-symbol {
  flex: 0 0 35px;
  width: 35px;
  border-bottom: 1px solid #cccccc;
}
#js-ide-part .feature-symbol.none-icon {
  background-color: white;
}
#js-ide-part .feature-symbol.angle-icon {
  background: white url('../img/svg/angle.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ide-part .feature-symbol.angularity-icon {
  background: white url('../img/svg/angularity.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ide-part .feature-symbol.chamfer-icon {
  background: white url('../img/svg/chamfer.svg') no-repeat 5px 1px;
  background-size: 27px;
}
#js-ide-part .feature-symbol.circular-runout-icon {
  background: white url('../img/svg/circular_runout.svg') no-repeat 5px 1px;
  background-size: 30px;
}
#js-ide-part .feature-symbol.circularity-icon {
  background: white url('../img/svg/circularity.svg') no-repeat 5px 3px;
  background-size: 26px;
}
#js-ide-part .feature-symbol.concentricity-icon {
  background: white url('../img/svg/concentricity.svg') no-repeat 5px 2px;
  background-size: 26px;
}
#js-ide-part .feature-symbol.counterbore-icon {
  background: white url('../img/svg/counterbore.svg') no-repeat 3px 0px;
  background-size: 29px;
}
#js-ide-part .feature-symbol.countersink-icon {
  background: white url('../img/svg/countersink.svg') no-repeat 5px 0px;
  background-size: 28px;
}
#js-ide-part .feature-symbol.cylindricity-icon {
  background: white url('../img/svg/cylindricity.svg') no-repeat 5px 0px;
  background-size: 30px;
}
#js-ide-part .feature-symbol.depth-icon {
  background: white url('../img/svg/depth.svg') no-repeat 5px 1px;
  background-size: 28px;
}
#js-ide-part .feature-symbol.diameter-icon {
  background: white url('../img/svg/diameter.svg') no-repeat 5px 3px;
  background-size: 24px;
}
#js-ide-part .feature-symbol.flatness-icon {
  background: white url('../img/svg/flatness.svg') no-repeat 5px 3px;
  background-size: 27px;
}
#js-ide-part .feature-symbol.line-profile-icon {
  background: white url('../img/svg/line_profile.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ide-part .feature-symbol.linear-dimension-icon,
#js-ide-part .feature-symbol.length-icon,
#js-ide-part .feature-symbol.distance-icon,
#js-ide-part .feature-symbol.width-icon {
  background: white url('../img/svg/linear_dimension.svg') no-repeat 5px 1px;
  background-size: 28px;
}
#js-ide-part .feature-symbol.parallelism-icon {
  background: white url('../img/svg/parallelism.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ide-part .feature-symbol.perpendicularity-icon {
  background: white url('../img/svg/perpendicularity.svg') no-repeat 5px 0px;
  background-size: 30px;
}
#js-ide-part .feature-symbol.position-icon {
  background: white url('../img/svg/position.svg') no-repeat 8px 2px;
  background-size: 25px;
}
#js-ide-part .feature-symbol.position-diametric-icon {
  background: white url('../img/svg/position_diametric.svg') no-repeat 3px 1px;
  background-size: 32px;
}
#js-ide-part .feature-symbol.position-spherical-icon {
  background: white url('../img/svg/position_spherical.svg') no-repeat 2px 4px;
  background-size: 33px;
}
#js-ide-part .feature-symbol.radius-icon {
  background: white url('../img/svg/radius.svg') no-repeat 5px 6px;
  background-size: 20px;
}
#js-ide-part .feature-symbol.surface-roughness-icon {
  background: white url('../img/svg/surface_roughness.svg') no-repeat 5px 0px;
  background-size: 30px;
}
#js-ide-part .feature-symbol.spherical-diameter-icon {
  background: white url('../img/svg/spherical_diameter.svg') no-repeat 4px 0px;
  background-size: 33px;
}
#js-ide-part .feature-symbol.spherical-radius-icon {
  background: white url('../img/svg/spherical_radius.svg') no-repeat 4px 0px;
  background-size: 33px;
}
#js-ide-part .feature-symbol.straightness-icon {
  background: white url('../img/svg/straightness.svg') no-repeat 5px 2px;
  background-size: 30px;
}
#js-ide-part .feature-symbol.surface-profile-icon {
  background: white url('../img/svg/surface_profile.svg') no-repeat 5px 0px;
  background-size: 32px;
}
#js-ide-part .feature-symbol.symmetry-icon {
  background: white url('../img/svg/symmetry.svg') no-repeat 5px 0px;
  background-size: 28px;
}
#js-ide-part .feature-symbol.tap-depth-icon {
  background: white url('../img/svg/tap_depth.svg') no-repeat 5px 1px;
  background-size: 26px;
}
#js-ide-part .feature-symbol.tap-diameter-icon {
  background: white url('../img/svg/tap_diameter.svg') no-repeat 5px 2px;
  background-size: 26px;
}
#js-ide-part .feature-symbol.taper-icon {
  background: white url('../img/svg/taper.svg') no-repeat 5px 1px;
  background-size: 28px;
}
#js-ide-part .feature-symbol.thread-icon {
  background: white url('../img/svg/thread.svg') no-repeat 5px 1px;
  background-size: 24px;
}
#js-ide-part .feature-symbol.thread-depth-icon {
  background: white url('../img/svg/thread_depth.svg') no-repeat 5px 3px;
  background-size: 24px;
}
#js-ide-part .feature-symbol.total-runout-icon {
  background: white url('../img/svg/total_runout.svg') no-repeat 5px 0px;
  background-size: 28px;
}
/*  #region overrides-UPLOADER   */
/*.qq-uploader {
        margin-left: 63px;
        min-width: 85%;
        max-width: 85%;
    }*/
.qq-upload-list {
  max-height: 120px;
}
.qq-upload-button,
.qq-upload-file,
.qq-upload-size,
.qq-upload-success {
  box-sizing: border-box;
  min-height: 40px;
  max-height: 40px;
}
.qq-upload-button {
  background-color: #3D9970;
  border: 1px solid #3D9970;
  color: white;
  display: block;
  max-width: 40px;
  min-width: 40px;
}
.qq-upload-button:hover {
  text-shadow: 1px 1px 1px #000;
}
.disabled .qq-upload-button {
  background-color: #d8d8d8;
  border-color: #d8d8d8;
}
.disabled .qq-upload-button:hover {
  cursor: not-allowed;
}
.qq-upload-button input {
  min-height: 40px;
  max-width: 40px;
  border: 1px solid white;
}
.qq-upload-list .qq-upload-success,
.qq-upload-list .qq-upload-fail {
  border: 1px solid #DDD;
  flex: 0 0 auto;
  height: 40px;
  position: relative;
}
.qq-upload-list a,
.qq-upload-list a:active,
.qq-upload-list a:hover,
.qq-upload-list a:visited {
  text-decoration: none;
}
.qq-upload-file,
.qq-upload-size {
  color: #000;
  display: inline-block;
  font-size: 10pt;
  height: 40px;
  line-height: 33px;
  margin: 0;
  overflow: hidden;
  padding: 3px 3px 3px 6px;
  text-overflow: ellipsis;
}
.qq-upload-size {
  padding-right: 50px;
  text-align: right;
}
.qq-delete-button {
  border-left: 1px solid #DDD;
  color: #111;
  font-size: 17pt;
  font-weight: 300;
  line-height: 38px;
  position: absolute;
  right: 0;
  text-align: center;
  width: 40px;
}
.qq-delete-button:hover {
  background-color: #FF4136;
  border-left: 1px solid #FF4136;
  color: white;
}
/* #endregion */
/* We re-use CAPA discipline tabs for PPAP objct selection, but with some custom styling */
.selected_ppap_obj .discipline-name {
  font-size: 13.5px;
}
.handsontable td.default_value {
  color: #999999;
}
/* PPAP Objects HOT table - mostly GD&T symbols, styling is subtly different everywhere the are used, so can't re-use other sets */
#js-ppap-obj-table .feature-symbol {
  flex: 0 0 35px;
  width: 35px;
  border-bottom: 1px solid #cccccc;
  background-color: rgba(247, 247, 247, 0.7);
}
#js-ppap-obj-table td.feature-composite {
  padding-left: 45px;
}
#js-ppap-obj-table td.feature-composite.none-icon {
  padding-left: 5px;
}
#js-ppap-obj-table .feature-symbol.angle-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/angle.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ppap-obj-table .feature-symbol.angularity-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/angularity.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ppap-obj-table .feature-symbol.chamfer-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/chamfer.svg') no-repeat 5px 1px;
  background-size: 27px;
}
#js-ppap-obj-table .feature-symbol.circular-runout-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/circular_runout.svg') no-repeat 5px 1px;
  background-size: 30px;
}
#js-ppap-obj-table .feature-symbol.circularity-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/circularity.svg') no-repeat 5px 3px;
  background-size: 26px;
}
#js-ppap-obj-table .feature-symbol.concentricity-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/concentricity.svg') no-repeat 5px 2px;
  background-size: 26px;
}
#js-ppap-obj-table .feature-symbol.counterbore-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/counterbore.svg') no-repeat 3px 0px;
  background-size: 29px;
}
#js-ppap-obj-table .feature-symbol.countersink-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/countersink.svg') no-repeat 5px 0px;
  background-size: 28px;
}
#js-ppap-obj-table .feature-symbol.cylindricity-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/cylindricity.svg') no-repeat 5px 0px;
  background-size: 30px;
}
#js-ppap-obj-table .feature-symbol.depth-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/depth.svg') no-repeat 5px 1px;
  background-size: 28px;
}
#js-ppap-obj-table .feature-symbol.diameter-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/diameter.svg') no-repeat 5px 3px;
  background-size: 24px;
}
#js-ppap-obj-table .feature-symbol.flatness-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/flatness.svg') no-repeat 5px 3px;
  background-size: 27px;
}
#js-ppap-obj-table .feature-symbol.line-profile-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/line_profile.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ppap-obj-table .feature-symbol.linear-dimension-icon,
#js-ppap-obj-table .feature-symbol.length-icon,
#js-ppap-obj-table .feature-symbol.distance-icon,
#js-ppap-obj-table .feature-symbol.width-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/linear_dimension.svg') no-repeat 5px 1px;
  background-size: 28px;
}
#js-ppap-obj-table .feature-symbol.parallelism-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/parallelism.svg') no-repeat 5px 3px;
  background-size: 30px;
}
#js-ppap-obj-table .feature-symbol.perpendicularity-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/perpendicularity.svg') no-repeat 5px 0px;
  background-size: 30px;
}
#js-ppap-obj-table .feature-symbol.position-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/position.svg') no-repeat 8px 2px;
  background-size: 25px;
}
#js-ppap-obj-table .feature-symbol.position-diametric-icon {
  background: white url('../img/svg/position_diametric.svg') no-repeat 3px 1px;
  background-size: 32px;
}
#js-ppap-obj-table .feature-symbol.position-spherical-icon {
  background: white url('../img/svg/position_spherical.svg') no-repeat 2px 4px;
  background-size: 33px;
}
#js-ppap-obj-table .feature-symbol.radius-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/radius.svg') no-repeat 5px 6px;
  background-size: 20px;
}
#js-ppap-obj-table .feature-symbol.surface-roughness-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/surface_roughness.svg') no-repeat 5px 0px;
  background-size: 30px;
}
#js-ppap-obj-table .feature-symbol.spherical-diameter-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/spherical_diameter.svg') no-repeat 4px 0px;
  background-size: 33px;
}
#js-ppap-obj-table .feature-symbol.spherical-radius-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/spherical_radius.svg') no-repeat 4px 0px;
  background-size: 33px;
}
#js-ppap-obj-table .feature-symbol.straightness-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/straightness.svg') no-repeat 5px 2px;
  background-size: 30px;
}
#js-ppap-obj-table .feature-symbol.surface-profile-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/surface_profile.svg') no-repeat 5px 0px;
  background-size: 32px;
}
#js-ppap-obj-table .feature-symbol.symmetry-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/symmetry.svg') no-repeat 5px 0px;
  background-size: 28px;
}
#js-ppap-obj-table .feature-symbol.tap-depth-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/tap_depth.svg') no-repeat 5px 1px;
  background-size: 26px;
}
#js-ppap-obj-table .feature-symbol.tap-diameter-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/tap_diameter.svg') no-repeat 5px 2px;
  background-size: 26px;
}
#js-ppap-obj-table .feature-symbol.taper-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/taper.svg') no-repeat 5px 1px;
  background-size: 28px;
}
#js-ppap-obj-table .feature-symbol.thread-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/thread.svg') no-repeat 5px 1px;
  background-size: 24px;
}
#js-ppap-obj-table .feature-symbol.thread-depth-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/thread_depth.svg') no-repeat 5px 3px;
  background-size: 24px;
}
#js-ppap-obj-table .feature-symbol.total-runout-icon {
  background: rgba(247, 247, 247, 0.7) url('../img/svg/total_runout.svg') no-repeat 5px 0px;
  background-size: 28px;
}
/* Need custom styling for SSO fields in settings - inputs need to handle long URLs & x509 certificates*/
.sso-details input {
  min-width: 710px;
}
.sso-details textarea {
  min-width: 710px;
  min-height: 325px;
  font-size: 14px;
}
.sso-details [readonly] {
  color: #808080 /*#5d5d5d*/;
  background-color: #fcfcfc;
  border: 1px solid #dcdcdc;
}
.grr-stats .header {
  text-align: center;
  margin-top: 5px;
}
.grr-stats td.heading {
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  padding: 1px 3px;
}
.grr-stats .status {
  color: #595959;
  font-size: 8pt;
  height: 25px;
  line-height: 24px;
  max-width: 100%;
  padding: 0 6px;
  text-align: center;
}
.grr-stats .value {
  text-align: center;
}
.grr-stats .label-red {
  color: #FFF;
  background-color: #FF4136;
  padding: 2px 3px;
  font-weight: 400;
}
.grr-stats .label-yellow {
  background-color: #FFDC00;
  padding: 2px 3px;
  font-weight: 400;
}
.grr-stats .label-green {
  color: #FFF;
  background-color: #3D9970;
  padding: 2px 3px;
  font-weight: 400;
}
.grr-stats td.label2 {
  padding: 2px 3px;
  width: 23%;
  font-size: 12px;
  font-weight: 300;
}
.validation-test {
  padding-left: 50px;
  margin-left: 20px;
}
.validation-test .status-info {
  margin-top: 10px;
  margin-right: 15px;
  font-style: italic;
  font-size: 15px;
}
.test-case {
  margin-top: -15px;
}
/* Styling for customer-supplier collab. message threads */
.message-thread {
  max-height: 420px;
  overflow-y: scroll;
}
.thread-entry {
  display: flex;
  margin-bottom: 15px;
  margin-right: 15px;
}
.thread-entry .entry-info {
  border: 1px solid #D8D8D8;
  flex: 3 3 0;
  font-size: 8.333pt;
  margin: 0;
  padding: 4px;
  text-align: left;
  transition-property: background-color, color;
  transition-duration: 200ms;
  transition-timing-function: ease-out;
}
.thread-entry .entry-info .control-button {
  color: #808080;
  cursor: pointer;
  margin-top: -13px;
  margin-right: 5px;
  height: inherit;
  font-size: 16px;
  text-align: center;
  line-height: 32px;
  display: inline-block;
  float: right;
}
.thread-entry .entry-text {
  flex: 24 24 0;
  border: 1px solid #D8D8D8;
  border-left: 0 none;
  color: #808080;
  padding-left: 5px;
  min-height: 45px;
  resize: none;
}
.thread-entry .entry-text .comments {
  white-space: pre-wrap;
}
.thread-entry .entry-text .attachment {
  margin-top: 10px;
  margin-bottom: 5px;
}
.thread-entry .entry-spacer {
  flex: 1 1 0;
  min-height: 45px;
  padding: 4px;
  resize: none;
}
.thread-entry.sent .entry-info {
  background-color: #f0f8ff;
}
.thread-entry.sent .entry-info .control-button {
  display: none;
}
.thread-entry.sent .entry-info:hover .control-button {
  display: inline-block;
}
.thread-entry.received .entry-info {
  background-color: #fff8d0;
}
.thread-entry.new .entry-text {
  border-left: none 0;
  border-right: none 0;
  padding-left: 5px;
  resize: vertical;
  color: black;
}
.thread-entry.new .entry-button {
  border: 1px solid #3D9970;
  background-color: #3D9970;
  color: white;
  cursor: pointer;
  flex: 1 1 0;
  font: normal normal normal 14px/1 "Black Tie";
  margin: 0;
  padding: 4px;
  height: inherit;
  text-align: center;
  transition-property: background-color, color;
  transition-duration: 200ms;
  transition-timing-function: ease-out;
}
.thread-entry.new .attach-button:hover,
.thread-entry.new .attach-button:focus,
.thread-entry.new .entry-button:hover,
.thread-entry.new .entry-button:focus {
  text-shadow: 1px 1px 1px #000000;
}
.qms-doc {
  height: 85vh;
  padding-left: 120px;
  font-family: "Inter", sans-serif !important;
  font-size: 1rem;
}
.qms-doc object {
  height: 100vh;
  width: 90%;
  margin-top: 10px;
}
.qms-doc .reference-doc {
  font-size: 26px;
  font-weight: 300;
}
.qms-doc .qms-sect input,
.qms-doc .qms-sect textarea,
.qms-doc .qms-sect div.view {
  border: 0;
  padding-top: 10px;
}
.qms-doc .qms-sect input:focus-visible,
.qms-doc .qms-sect textarea:focus-visible {
  outline: none;
}
.qms-doc .qms-sect .header {
  width: 90%;
}
.qms-doc .qms-sect .section_no {
  padding: 0 4px;
  font-weight: bold;
}
.qms-doc .qms-sect .heading {
  flex: 25 1 0;
  padding: 0 4px;
  margin-right: 15px;
  font-weight: bold;
}
.qms-doc .qms-sect .flex-set.content-flex {
  width: 95%;
}
.qms-doc .qms-sect .flex-set.inline-edit-content-flex {
  width: 100%;
}
.qms-doc .qms-sect .content {
  white-space: pre-wrap;
  font-size: 1rem;
  line-height: 1.25rem;
  margin: 0;
  padding: 0;
}
.qms-doc .qms-sect .content.dropAreaGood {
  border: 5px solid green;
}
.qms-doc .qms-sect .content.dropAreaBad {
  border: 5px solid red;
}
.qms-doc .qms-sect {
  border-width: 2px;
  border-style: solid;
  border-color: transparent;
}
.qms-doc .qms-sect.hilite {
  background-color: aliceblue;
  border-color: darkgreen;
}
.qms-doc .qms-sect.hilite .header *,
.qms-doc .qms-sect.hilite .content-flex *,
.qms-doc .qms-sect.hilite .section-controls {
  background-color: aliceblue;
}
.qms-doc .qms-sect.inline .section-controls {
  padding-top: 0;
}
.qms-doc .content-control {
  display: inline-block;
}
.qms-doc .content-control svg {
  width: 17px;
  height: 17px;
}
.qms-doc .qms-sect.inserted,
.qms-doc span.inserted,
.qms-doc span.inserted li,
.qms-doc .content-control.new {
  background-color: #a8f5b1;
  color: #0e8606;
}
.qms-doc .qms-sect.inserted svg,
.qms-doc span.inserted svg,
.qms-doc span.inserted li svg,
.qms-doc .content-control.new svg {
  fill: #0e8606;
}
.qms-doc .qms-sect.deleted,
.qms-doc span.deleted,
.qms-doc span.deleted li {
  color: darkred;
  text-decoration: line-through;
}
.qms-doc .content-control.orig {
  color: darkred;
  background-color: #ff8989;
}
.qms-doc .content-control.orig svg {
  fill: darkred;
}
.qms-doc .qms-sect.attachment .content {
  width: 60%;
}
.qms-doc .qms-sect.attachment .content.image {
  width: 40%;
  margin-right: 15px;
  display: table;
}
.qms-doc .qms-sect.attachment .content.image .image-holder {
  flex: 1;
  display: table;
  padding-bottom: 4px;
}
.qms-doc .qms-sect.attachment .content.image .image-holder {
  text-align: center;
  width: 100%;
  border: 4px solid transparent;
  border-radius: 4px;
}
.qms-doc .qms-sect.attachment .content.image .image-holder img,
.qms-doc .qms-sect.attachment .content.image .image-holder video {
  max-width: 100%;
}
.qms-doc .qms-sect.attachment .content.image .image-holder .caption {
  padding: 4px;
  min-height: 30px;
  text-align: center;
}
.qms-doc .qms-sect.attachment .content.image .image-holder.selected {
  border: 4px solid #0074d9;
}
.qms-doc .qms-sect.attachment .content.image div.inserted {
  border: 5px solid #0e8606;
  background-color: #a8f5b1;
}
.qms-doc .qms-sect.attachment .content.image div.inserted img {
  opacity: 66%;
}
.qms-doc .qms-sect.attachment .content.image div.deleted {
  border: 5px solid darkred;
  background-color: #ff8989;
}
.qms-doc .qms-sect.attachment .content.image div.deleted img {
  opacity: 66%;
}
.qms-doc .qms-sect.attachment .content.image .changed {
  display: flex;
}
.qms-doc .qms-sect.attachment .content.image .changed .deleted {
  flex: 50%;
  display: table;
}
.qms-doc .qms-sect.attachment .content.image .changed .inserted {
  flex: 50%;
  display: table;
}
.qms-doc .qms-sect.attachment.vertical .flex-set.content-flex,
.qms-doc .qms-sect.attachment.vertical .flex-set.inline-edit-content-flex {
  flex-direction: column;
}
.qms-doc .qms-sect.attachment.vertical .content {
  width: 100%;
}
.qms-doc .qms-sect.attachment.vertical .content.image {
  width: 100%;
  display: flex;
  gap: 10px;
}
.qms-doc .qms-sect.depth-1 {
  padding-left: 0;
}
.qms-doc .qms-sect.depth-1 .section_no,
.qms-doc .qms-sect.depth-1 .heading {
  font-size: 30pt;
  height: 40pt;
  letter-spacing: 0.1rem;
}
.qms-doc .qms-sect.inline.depth-1 .section_no {
  font-size: 30pt;
  height: 30pt;
  line-height: 30pt;
}
.qms-doc .qms-sect.depth-2 {
  padding-left: 15px;
}
.qms-doc .qms-sect.depth-2 .section_no,
.qms-doc .qms-sect.depth-2 .heading {
  font-size: 24pt;
  height: 33pt;
  letter-spacing: 0.025rem;
}
.qms-doc .qms-sect.inline.depth-2 .section_no {
  font-size: 13pt;
  height: 16pt;
  line-height: 16pt;
}
.qms-doc .qms-sect.depth-3 {
  padding-left: 30px;
}
.qms-doc .qms-sect.depth-3 .section_no,
.qms-doc .qms-sect.depth-3 .heading {
  font-size: 18pt;
  height: 27pt;
}
.qms-doc .qms-sect.inline.depth-3 .section_no {
  font-size: 13pt;
  height: 16pt;
  line-height: 16pt;
}
.qms-doc .qms-sect.depth-4 {
  padding-left: 45px;
}
.qms-doc .qms-sect.depth-4 .section_no,
.qms-doc .qms-sect.depth-4 .heading {
  font-size: 16pt;
  height: 24pt;
}
.qms-doc .qms-sect.inline.depth-4 .section_no {
  font-size: 13pt;
  height: 16pt;
  line-height: 16pt;
}
.qms-doc .qms-sect.depth-5 {
  padding-left: 60px;
}
.qms-doc .qms-sect.depth-5 .section_no,
.qms-doc .qms-sect.depth-5 .heading {
  font-size: 14pt;
  height: 22pt;
}
.qms-doc .qms-sect.inline.depth-5 .section_no {
  font-size: 13pt;
  height: 16pt;
  line-height: 16pt;
}
.qms-doc .qms-sect.inline textarea {
  min-height: 20px;
}
.qms-training .qms-doc {
  height: 80vh;
}
.qms-doc.external {
  padding-left: 60px;
}
.qms-doc.external .reference-doc {
  width: 63%;
}
.qms-doc.external .reference-doc object {
  width: 100%;
  padding-right: 20px;
}
.qms-doc.external .qms-sect textarea {
  width: 45%;
}
.qms-doc .qms-sect .content.view li,
.pane-container .format-sample li {
  list-style-position: inside;
  list-style-type: "• ";
  -webkit-padding-start: 34px;
          padding-inline-start: 34px;
  text-indent: -14px;
  margin-bottom: -15pt;
}
.qms-doc .qms-sect .content.view li::marker,
.pane-container .format-sample li::marker {
  font-family: Tahoma, serif;
}
.qms-doc .qms-sect .content.view li:last-child,
.pane-container .format-sample li:last-child {
  margin-bottom: -8pt;
}
.qms-doc .qms-sect em,
.pane-container .format-sample em {
  font-weight: bolder;
  font-style: normal;
}
.qms-doc .qms-sect mark,
.pane-container .format-sample mark {
  font-weight: bolder;
  color: #ffb500;
  font-style: normal;
  background-color: unset;
}
.qms-doc .qms-sect mark:before,
.pane-container .format-sample mark:before {
  content: "\f062";
  font: normal normal normal 14px/1 "Black Tie";
  display: inline-block;
  font-size: inherit;
  vertical-align: -14.28571429%;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  margin-right: 3px;
}
.qms-doc .qms-sect li mark:before,
.pane-container .format-sample li mark:before {
  margin-left: 14px;
}
.qms-doc .qms-sect strong,
.pane-container .format-sample strong {
  font-weight: bolder;
  color: red;
  font-style: normal;
}
.qms-doc .qms-sect strong:before,
.pane-container .format-sample strong:before {
  content: "\f063";
  font: normal normal normal 14px/1 "Black Tie";
  display: inline-block;
  font-size: inherit;
  vertical-align: -14.28571429%;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  margin-right: 3px;
}
.qms-doc .qms-sect li strong:before,
.pane-container .format-sample li strong:before {
  margin-left: 14px;
}
.qms-doc .qms-sect .bad--link,
.pane-container .format-sample .bad--link {
  cursor: not-allowed;
  color: #942828;
  -webkit-text-decoration: underline wavy;
          text-decoration: underline wavy;
}
.qms-related {
  height: 75vh;
  overflow-y: scroll;
  padding-left: 63px;
}
.pane-container .format-sample {
  white-space: pre-wrap;
  border: solid grey 2px;
  padding: 5px;
  margin: 10px 0;
}
form .training-confirm {
  color: grey;
  cursor: pointer;
}
.quiz-questions .quiz-question {
  margin-top: 5px;
}
.training-questions {
  margin-top: 10px;
}
.training-questions .question-text {
  font-style: italic;
}
.note-list {
  display: grid;
  gap: 8px;
  grid-template-columns: 106px 150px 1fr;
  font-size: 11px;
}
.note-list .date-time {
  grid-column: 1;
}
.note-list .identity {
  grid-column: 2;
}
.note-list .content {
  grid-column: 3;
}
.note-input {
  border-radius: 3px;
  border: 1px solid #d8d8d8;
  font-size: 12px;
  height: 32px;
  padding: 4px 10px;
  width: 100%;
  margin-top: 5px !important;
  margin-bottom: 0 !important;
}
.app-container .note-list,
.app-container .note-input {
  margin-right: 30px;
}
.state-map {
  align-items: center;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  height: auto;
  padding: 10px 0;
  width: 100%;
}
.state-map .state {
  border-width: 3px;
  border-radius: 24px;
  cursor: pointer;
  font-size: 14px;
  text-transform: uppercase;
}
.state-map .rail {
  background-color: #cacaca;
  height: 3px;
  width: 100%;
}
.state-map .state.selected {
  background-color: #0074d9;
  border-color: #0074d9;
  color: white;
  font-weight: 600;
}
.state-map .state.selected.approved {
  background-color: #3D9970;
  border-color: #3D9970;
}
.state-map .state.selected.rejected {
  background-color: #FF4136;
  border-color: #FF4136;
}
.state-map .state:disabled {
  cursor: default;
}
.state-map .state:hover:not(:disabled) {
  background-color: rgba(0, 116, 217, 0.5);
  border: 1px solid rgba(0, 116, 217, 0.5);
  color: #111111;
}
.state-map .col-1 {
  grid-column: 1;
}
.state-map .col-2 {
  grid-column: 2;
}
.state-map .col-3 {
  grid-column: 3;
}
.state-map .col-4 {
  grid-column: 4;
}
.state-map .col-5 {
  grid-column: 5;
}
.state-map .col-6 {
  grid-column: 6;
}
.toolbar {
  background-color: #f2f2f2;
  border-right: 1px solid #d8d8d8;
  display: grid;
  gap: 0;
  grid-template-columns: 64px repeat(auto-fill, 50px);
  height: 50px;
  padding-left: 50px;
  width: 100%;
}
.toolbar button {
  cursor: pointer;
}
.toolbar button.available svg {
  fill: black;
}
.toolbar button.selected svg {
  fill: white;
}
.toolbar button.disabled {
  cursor: not-allowed;
}
.toolbar button.disabled svg {
  fill: #d8d8d8;
}
.toolbar button.disabled svg path[fill] {
  fill: #d8d8d8;
}
.toolbar .toolbar-block,
.toolbar .toolbar-tool {
  align-items: center;
  display: grid;
  height: 50px;
  justify-items: center;
  min-width: 50px;
  width: 50px;
}
.toolbar .toolbar-tool {
  background-color: #ffffff;
  border-top: 0;
  border-right: 1px solid #d8d8d8;
  border-bottom: 1px solid #d8d8d8;
  border-left: 0;
}
.toolbar .toolbar-block + .toolbar-tool {
  border-left: 1px solid #d8d8d8;
}
.toolbar .toolbar-tool.selected {
  background-color: #222222;
  border: 1px solid #222222;
}
.toolbar .fill-1 {
  grid-column: 1;
}
.toolbar .tool-2 {
  grid-column: 2;
}
.toolbar .tool-3 {
  grid-column: 3;
}
.toolbar .fill-4 {
  grid-column: 4;
}
.toolbar .tool-5 {
  grid-column: 5;
}
.toolbar .tool-6 {
  grid-column: 6;
}
.toolbar .tool-7 {
  grid-column: 7;
}
.toolbar .tool-8 {
  grid-column: 8;
}
.toolbar .tool-9 {
  grid-column: 9;
  padding-top: 6px;
}
.toolbar .tool-10 {
  grid-column: 10;
}
.toolbar .tool-11 {
  grid-column: 11;
  padding-top: 4px;
}
.toolbar .tool-12 {
  grid-column: 12;
}
.toolbar .tool-13 {
  grid-column: 13;
}
.toolbar .fill-14 {
  grid-column: 14;
}
.toolbar .tool-15 {
  grid-column: 15;
}
.toolbar .tool-16 {
  grid-column: 16;
}
.toolbar .tool-17 {
  grid-column: 17;
}
.toolbar .tool-18 {
  grid-column: 18;
}
.toolbar .tool-19 {
  grid-column: 19;
}
.toolbar .tool-20 {
  grid-column: 20;
}
/* TODO: rename from fai - it's used in all modules */
.fai-label {
  width: 100%;
  font-weight: 300;
  margin-bottom: 5px;
}
.fai-buttons {
  width: 100%;
  /*margin-right: 6px;*/
  padding: 0 4px;
  font-size: 10pt;
  font-weight: 300;
}
form.scroll_bar {
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 80%;
}
form.scroll_bar.shorter {
  max-height: 63%;
}
/* #region  TOOLTIP OVERRIDES */
.hint:after,
[data-hint]:after {
  color: #FFB300;
  font-weight: 600;
}
/* #endregion */