/*

  Compiler: https://www.npmjs.com/package/node-sass
  Command: node-sass --output-styled expanded main.scss main.css

 */
@import url("//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");
@import url("//maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css");
@import url("/js/bootstrap-select/dist/css/bootstrap-select.min.css");
@import url("/js/bootstrap-datepicker/css/bootstrap-datepicker.min.css");
@import url("//cdn.datatables.net/1.10.16/css/dataTables.bootstrap.min.css");
@import url("//cdn.datatables.net/buttons/1.5.1/css/buttons.dataTables.min.css");
@import url("//cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");
@import "fhir-mdi.css?v=20260506-4";

body {
  font-family: Arial, sans-serif;
  font-size: 10pt;
  margin-bottom: 100px;
}

th {
  font-family: Arial, sans-serif;
}

/*td {*/
/*  font-family: Arial, sans-serif;*/
/*  font-size: 10pt;*/
/*}*/

p {
  font-family: Arial, sans-serif;
  font-size: 10pt;
}

li {
  font-family: Arial, sans-serif;
  font-size: 10pt;
}

pre {
  font-family: Courier;
  font-size: 10pt;
}

option {
  font-family: Courier;
  font-size: 10pt;
}

h1 {
  font-family: Arial, sans-serif;
}

h2 {
  font-family: Arial, sans-serif;
}

h3 {
  font-family: Arial, sans-serif;
}

h4 {
  font-family: Arial, sans-serif;
}

.title {
  font-family: Arial, sans-serif;
  font-size: 14pt;
  color: #000000;
  font-weight: bold;
}

.small {
  font-size: 8pt;
}

.tiny {
  font-size: 6pt;
}

.bold {
  font-weight: bold;
}

.striken {
  text-decoration: line-through;
}

table.formTable td {
  text-align: left;
}

table tr td table td {
  padding: 5px !important;
}

.headbar {
  color: #000000;
  line-height: 16px;
  font-size: 14px;
}

.headbar .fa {
  font-size: 20px;
}

.bg-form-mdi {
  background: rgba(154, 207, 234, 0.25);
  border: 2px solid #337ab7;
}

/* White background with a black border */
.bg-form-white {
  background: #ffffff;
  border: 2px solid #000000;
}

.bg-form-mdi.space10 {
  padding: 10px;
}

.headbar .hbtn {
  display: inline-block;
  border: 1px solid #000000;
  color: #000000;
  padding: 4px 8px;
  font-size: 20px;
  line-height: 20px;
  border-radius: 3px;
  margin: 4px 2px;
  min-width: 36px;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
}

.headbar .hbtn:hover {
  color: #3099a4;
  background-color: #eee;
}

.headbar .hbtn sup {
  font-size: 12px;
}

.headbar a {
  color: #000000;
  line-height: 16px;
  font-size: 16px;
  cursor: pointer;
  text-decoration: underline;
}

.headbar a:hover {
  text-decoration: none;
}

.icon-btn-disabled {
  display: inline-block;
  border: 1px solid #656565;
  color: #656565;
  padding: 4px 8px;
  font-size: 40px;
  line-height: 20px;
  border-radius: 3px;
  margin: 4px 2px;
  min-width: 64px;
  width: 64px;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
  background: linear-gradient(rgb(220, 220, 220), rgb(190, 190, 190));
}

.icon-btn {
  display: inline-block;
  border: 1px solid #054b8f;
  color: #054b8f;
  padding: 4px 8px;
  font-size: 40px;
  line-height: 20px;
  border-radius: 3px;
  margin: 4px 2px;
  min-width: 64px;
  width: 64px;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
  background: linear-gradient(#d9daed, #c0c6ff);
}

.icon-btn:hover {
  color: #4647db;
  border: 1px solid #4647db;
  background: linear-gradient(#c0c6ff, #d9daed);
}

.icon-btn-staff {
  color: whitesmoke !important;
  background-image: linear-gradient(to bottom, #ff00fc 0, #c011ff 100%) !important;
  border-color: #ab07ff !important;
}

.icon-btn-staff:hover {
  color: whitesmoke !important;
  background-image: linear-gradient(to top, #ff00fc 0, #c011ff 100%) !important;
  border-color: #ab07ff !important;
}

.icon-link-disabled {
  color: #656565;
  text-decoration: none;
  font-size: 11pt;
  font-weight: bold;
}

.icon-link {
  color: #054b8f;
  text-decoration: none;
  font-size: 11pt;
  font-weight: bold;
}

.icon-link:hover {
  color: #4647db;
  text-decoration: underline;
}

::placeholder {
  color: #888 !important;
  font-weight: normal;
}

::-webkit-tap-highlight-color {
  color: #888 !important;
  font-weight: normal;
}

#user_name_input {
  color: #333;
}

/*
 * STAFF Color

 */
.btn-staff {
  color: whitesmoke;
  text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.08);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 1px rgba(255, 255, 255, 0.07);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.29), 0 1px 1px rgba(255, 255, 255, 0.07);
}

.btn-staff.active, .btn-staff:active {
  -webkit-box-shadow: inset 0 3px 5px rgba(255, 255, 255, 0.29);
  box-shadow: inset 0 3px 5px rgba(255, 255, 255, 0.29);
}

.btn-staff .badge {
  text-shadow: none;
}

.btn-staff {
  background-image: -webkit-linear-gradient(top, #ff00fc 0, #c011ff 100%);
  background-image: -o-linear-gradient(top, #ff00fc 0, #c011ff 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff00fc), to(#c011ff));
  background-image: linear-gradient(to bottom, #ff00fc 0, #c011ff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff00fc', endColorstr='#ffc011ff', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  background-repeat: repeat-x;
  border-color: #ab07ff;
}

.btn-staff:focus, .btn-staff:hover {
  color: whitesmoke;
  background-color: #c011ff;
  background-position: 0 -15px;
}

.btn-staff.active, .btn-staff:active {
  background-color: #c011ff;
  border-color: #ab07ff;
}

.btn-staff.disabled, .btn-staff:disabled, .btn-staff[disabled] {
  background-color: #c011ff;
  background-image: none;
}

.alert-staff {
  background-image: -webkit-linear-gradient(top, #ff90e9 0, #ff71d7 100%);
  background-image: -o-linear-gradient(top, #ff90e9 0, #ff71d7 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff90e9), to(#ff71d7));
  background-image: linear-gradient(to bottom, #ff90e9 0, #ff71d7 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff90e9', endColorstr='#ff71d7', GradientType=0);
  background-repeat: repeat-x;
  border-color: #ab07ff;
}

.text-staff {
  color: #9c06ff;
}

/* BS5-palette warning for text. BS3's .text-warning (#8a6d3b) is muddy;
   BS5's --bs-warning (#ffc107) is too light on white. #f0ad4e reads as
   a clear amber on white and still signals "caution". */
.text-warning5 {
  color: #f0ad4e;
}

/* BS5 warning utility family — renamed to *warning5 to coexist with BS3 .text-warning / .btn-warning / .alert-warning on pages that still load Bootstrap 3. Values copied verbatim from Bootstrap v5.0.2. */
.bg-warning5 {
  background-color: #ffc107 !important;
}

.border-warning5 {
  border-color: #ffc107 !important;
}

.link-warning5 {
  color: #ffc107;
}

.link-warning5:focus,
.link-warning5:hover {
  color: #ffcd39;
}

.btn-warning5 {
  color: #000;
  background-color: #ffc107;
  border-color: #ffc107;
}

.btn-warning5:hover {
  color: #000;
  background-color: #ffca2c;
  border-color: #ffc720;
}

.btn-check:focus + .btn-warning5,
.btn-warning5:focus {
  color: #000;
  background-color: #ffca2c;
  border-color: #ffc720;
  box-shadow: 0 0 0 .25rem rgba(217, 164, 6, .5);
}

.btn-check:active + .btn-warning5,
.btn-check:checked + .btn-warning5,
.btn-warning5.active,
.btn-warning5:active,
.show > .btn-warning5.dropdown-toggle {
  color: #000;
  background-color: #ffcd39;
  border-color: #ffc720;
}

.btn-check:active + .btn-warning5:focus,
.btn-check:checked + .btn-warning5:focus,
.btn-warning5.active:focus,
.btn-warning5:active:focus,
.show > .btn-warning5.dropdown-toggle:focus {
  box-shadow: 0 0 0 .25rem rgba(217, 164, 6, .5);
}

.btn-warning5.disabled,
.btn-warning5:disabled {
  color: #000;
  background-color: #ffc107;
  border-color: #ffc107;
}

.btn-outline-warning5 {
  color: #ffc107;
  border-color: #ffc107;
}

.btn-outline-warning5:hover {
  color: #000;
  background-color: #ffc107;
  border-color: #ffc107;
}

.btn-check:focus + .btn-outline-warning5,
.btn-outline-warning5:focus {
  box-shadow: 0 0 0 .25rem rgba(255, 193, 7, .5);
}

.btn-check:active + .btn-outline-warning5,
.btn-check:checked + .btn-outline-warning5,
.btn-outline-warning5.active,
.btn-outline-warning5.dropdown-toggle.show,
.btn-outline-warning5:active {
  color: #000;
  background-color: #ffc107;
  border-color: #ffc107;
}

.btn-check:active + .btn-outline-warning5:focus,
.btn-check:checked + .btn-outline-warning5:focus,
.btn-outline-warning5.active:focus,
.btn-outline-warning5.dropdown-toggle.show:focus,
.btn-outline-warning5:active:focus {
  box-shadow: 0 0 0 .25rem rgba(255, 193, 7, .5);
}

.btn-outline-warning5.disabled,
.btn-outline-warning5:disabled {
  color: #ffc107;
  background-color: transparent;
}

.alert-warning5 {
  color: #664d03;
  background-color: #fff3cd;
  border-color: #ffecb5;
}

.alert-warning5 .alert-link {
  color: #523e02;
}

.table-warning5 {
  --bs-table-bg: #fff3cd;
  --bs-table-striped-bg: #f2e7c3;
  --bs-table-striped-color: #000;
  --bs-table-active-bg: #e6dbb9;
  --bs-table-active-color: #000;
  --bs-table-hover-bg: #ece1be;
  --bs-table-hover-color: #000;
  color: #000;
  border-color: #e6dbb9;
}

.list-group-item-warning5 {
  color: #664d03;
  background-color: #fff3cd;
}

.list-group-item-warning5.list-group-item-action:focus,
.list-group-item-warning5.list-group-item-action:hover {
  color: #664d03;
  background-color: #e6dbb9;
}

.list-group-item-warning5.list-group-item-action.active {
  color: #fff;
  background-color: #664d03;
  border-color: #664d03;
}

.bg-staff {
  background-color: rgba(255, 144, 233, 0.57);
}

.panel-staff > .panel-heading {
  background-image: -webkit-linear-gradient(top, #ff90e9 0, #ff71d7 100%);
  background-image: -o-linear-gradient(top, #ff90e9 0, #ff71d7 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff90e9), to(#ff71d7));
  background-image: linear-gradient(to bottom, #ff90e9 0, #ff71d7 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff90e9', endColorstr='#ffff71d7', GradientType=0);
  background-repeat: repeat-x;
}

.panel-staff {
  border: 1px solid #ab07ff;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.panel-staff-outline {
  border: 1px solid #ab07ff;
  border-radius: 4px;
  background: #fff;
}

.btn-staff-outline {
  background-color: #fff;
  color: #333;
  border: 1px solid #ab07ff;
}

.btn-staff-outline:hover,
.btn-staff-outline:focus {
  background-color: #f5f0fa;
  color: #333;
  border-color: #ab07ff;
}

.btn-outline-dark {
  background-color: #fff;
  color: #333;
  border: 1px solid #333;
}

.btn-outline-dark:hover,
.btn-outline-dark:focus {
  background-color: #f5f5f5;
  color: #333;
  border-color: #333;
}

.btn-status-text {
  background-color: #fff;
  border: 1px solid #333;
  padding-left: 5px;
  padding-right: 5px;
}

.btn-status-text:hover,
.btn-status-text:focus {
  background-color: #f5f5f5;
  border-color: #333;
}

.btn-status-text.text-primary { color: #337ab7; }
.btn-status-text.text-success { color: #3c763d; }
.btn-status-text.text-danger { color: #a94442; }
.btn-status-text.text-warning { color: #8a6d3b; }
.btn-status-text.text-info { color: #31708f; }

.btn-status-text:hover.text-primary,
.btn-status-text:focus.text-primary { color: #286090; }
.btn-status-text:hover.text-success,
.btn-status-text:focus.text-success { color: #2b542c; }
.btn-status-text:hover.text-danger,
.btn-status-text:focus.text-danger { color: #843534; }
.btn-status-text:hover.text-warning,
.btn-status-text:focus.text-warning { color: #66512c; }
.btn-status-text:hover.text-info,
.btn-status-text:focus.text-info { color: #245269; }

.hr-text {
  line-height: 1em;
  position: relative;
  outline: 0;
  border: 0;
  color: black;
  text-align: center;
  height: 1.5em;
  opacity: 0.5;
}

.hr-text:before {
  content: '';
  background: linear-gradient(to right, transparent, #818078, transparent);
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 1px;
}

.hr-text:after {
  content: attr(data-content);
  position: relative;
  display: inline-block;
  color: black;
  padding: 0 0.5em;
  line-height: 1.5em;
  color: #818078;
  background-color: #fcfcfa;
}

.clear__input__field {
  float: right;
  margin-top: -25px;
  margin-right: 8px;
  display: block;
  cursor: pointer;
  font-size: larger;
}

.clear__input__field:hover {
  font-size: x-large;
  margin-top: -27px;
  margin-right: 6px;
}

.upload-area {
  width: 100%;
  height: 200px;
  border: 2px solid lightgray;
  border-radius: 3px;
  margin: 0 auto;
  margin-top: 20px;
  text-align: center;
  background: #d9edf7;
  overflow: auto;
}

.upload-area:hover {
  cursor: pointer;
}

.upload-area h1 {
  margin-top: 40px;
  text-align: center;
  font-weight: normal;
  font-family: sans-serif;
  line-height: 40px;
  color: darkslategray;
}

.upload-area > h1 > span {
  font-size: 20px;
  text-align: center;
  font-weight: normal;
  font-family: sans-serif;
}

#file {
  display: none;
}

/* Thumbnail */
.thumbnail {
  width: 95px;
  padding: 7px;
  border: 2px solid lightgray;
  border-radius: 3px;
  float: left;
  margin: 5px;
}

.size {
  font-size: 12px;
}

.table {
  width: auto;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.form-control {
  margin-left: auto;
}

.iconminus {
  font-weight: bold;
  color: red;
}

.iconplus {
  font-weight: bold;
  color: green;
}

.iconplay {
  font-weight: bold;
  color: orange;
}

.form-group {
  margin-bottom: 0;
}

#cart_table_filter {
  width: 240px;
}

#cart_table_filter label input {
  width: 220px;
  padding: 6px 4px;
  border-radius: 4px;
  border: 1px solid #ccc;
}

.btn-ajax-score {
  margin-top: 3px;
  width: 165px;
}

a.boxlink {
  font-weight: bold;
  position: relative;
  z-index: 1;
  text-decoration: none;
  color: #000000;
}

a.boxlink:hover {
  text-indent: 0;
  z-index: 2;
  text-decoration: none;
}

a.boxlink span, a.boxlink:visited span {
  display: none;
}

a.boxlink:hover span {
  top: 1.5em;
  left: 2em;
  height: auto;
  display: block;
  position: absolute;
}

span.boxhover {
  padding: 2px;
  width: 30em;
  font-weight: bold;
  text-align: left;
  border: 1px solid #000000;
  color: #000000;
  background-color: #ffffff;
}

/* START -- top menu */
.topnav {
  /*  border:1px solid #888;*/
  margin: 2px 0px;
  width: 100%;
  height: 68px;
}

.topnavitem {
  width: 120px;
  border: 1px solid #888;
  word-wrap: normal;
  margin: 0 2px;
  border-radius: 5px;
  text-align: center;
  background: linear-gradient(#064b8f, #0a6dcf);
}

.topnavitem:hover {
  background: linear-gradient(#0a6dcf, #064b8f);
}

.topnavitem a {
  text-decoration: none;
}

.navitembox {
  color: #d8d8d8;
  font-size: 14px;
  word-wrap: normal;
  white-space: normal !important;
  width: 120px;
  height: 64px;
  margin: 0 auto;
  display: block;
  line-height: 16px;
}

.navitembox i, .navitembox-special i {
  font-size: 20px;
  display: inline-block !important;
  margin-top: 3px;
}

.navitembox hr {
  margin: 3px 10px;
  display: block;
  height: 1px;
  border: none;
  border-top: 2px solid #c0c0c0;
}

.navitembox-special hr {
  margin: 3px 10px;
  display: block;
  height: 1px;
  border: none;
  border-top: 2px solid #00df00;
}

.navitembox-special {
  color: #00df00;
  font-size: 14px;
  word-wrap: normal;
  white-space: normal !important;
  width: 120px;
  height: 64px;
  margin: 0 auto;
  display: block;
  line-height: 16px;
}

.slick-arrow {
  z-index: 1000 !important;
}

.tiny {
  color: #00df00;
  font-size: 10px !important;
  font-weight: bold;
}

::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: black;
  opacity: 1;
  /* Firefox */
}

:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: black;
}

::-ms-input-placeholder {
  /* Microsoft Edge */
  color: black;
}

/* END -- top menu */
/* START -- steps menu */
.container_steps_bar {
  max-width: 900px;
  min-width: 640px;
  min-height: 90px;
  width: 830px;
  margin: 5px auto;
}

.steps_btn {
  margin-top: 5px;
}

.progressbar {
  counter-reset: step;
}

.progressbar li {
  list-style-type: none;
  width: 20%;
  float: left;
  font-size: 12px;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  color: #7d7d7d;
  /*cursor: pointer;*/
}

.progressbar li:before {
  width: 30px;
  height: 30px;
  content: counter(step);
  counter-increment: step;
  line-height: 30px;
  border: 2px solid #7d7d7d;
  display: block;
  text-align: center;
  margin: 0 auto 10px auto;
  border-radius: 50%;
  background-color: #ffffff;
}

.progressbar li:after {
  width: 99%;
  height: 2px;
  content: '';
  position: absolute;
  background-color: #7d7d7d;
  top: 15px;
  left: -50%;
  z-index: -1;
}

.progressbar li:first-child:after {
  content: none;
}

/*
.progressbar li:hover {
  text-decoration: none;
  padding: 5px;
  color: #33cc33;
}
*/
.progressbar li.active {
  color: green;
}

.progressbar li.active:before {
  border-color: #55b776;
}

.progressbar li.active + li:after {
  background-color: #55b776;
}

.flash {
  -webkit-animation-name: flash-animation;
  -webkit-animation-duration: 0.4s;
  animation-name: flash-animation;
  animation-duration: 0.4s;
}

@-webkit-keyframes flash-animation {
  from {
    color: #99ffcc;
  }
  to {
    color: default;
  }
}

@keyframes flash-animation {
  from {
    color: #99ffcc;
  }
  to {
    color: default;
  }
}

/*
    BS circle btn
 */
.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 15px;
}

.btn-circle.btn-lg {
  width: 45px;
  height: 45px;
  padding: 1px 1px;
  font-size: 32px;
  line-height: -0.33;
  border-radius: 25px;
}

.btn-circle.btn-xl {
  width: 70px;
  height: 70px;
  padding: 10px 16px;
  font-size: 24px;
  line-height: 1.33;
  border-radius: 35px;
}

/* END -- steps menu */
.ul-measure-print {
  margin-left: -15px;
}

.col-measure-print {
  background-color: rgba(192, 192, 192, 0.25);
  margin: 5px 0px 0px 5px;
  width: 232px;
  min-height: 125px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 5px;
}

.col-measure-print-2 {
  background-color: rgba(192, 192, 192, 0.25);
  margin: 5px 0px 0px 5px;
  width: 470px;
  min-height: 125px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 5px;
}

.extra_left {
  padding-left: 5px;
}

.row-measure-print {
  display: flex;
}

.row-flex {
  flex-grow: 1;
}

label.col-measure-print {
  margin-left: 15px;
}

.basket-padding {
  padding: 15px 15px 15px 15px;
}

.transparent_class {
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  /* IE 5-7 */
  filter: alpha(opacity=50);
  /* Netscape */
  -moz-opacity: 0.5;
  /* Safari 1.x */
  -khtml-opacity: 0.5;
  /* Good browsers */
  opacity: 0.5;
}

.top-alert {
  position: fixed;
  top: 90%;
  width: 98%;
  z-index: 100000;
  padding: 20px;
  display: inline-block;
  text-align: right;
}

.top-alert .alert {
  width: auto !important;
  height: 100%;
  display: inline;
  position: relative;
  margin: 0;
}

.top-alert .alert .close {
  position: absolute;
  top: 11px;
  right: 10px;
  color: inherit;
}

@keyframes notiny-animation-show-wtf {
  0% {
    opacity: 0;
    filter: blur(4px);
  }
  15% {
    opacity: 1;
  }
  50% {
  }
  90% {
    filter: blur(0px);
  }
  100% {
  }
}

div#banner {
  margin: auto;
  width: 60%;
  padding: 10px;
  text-align: center;
}

div#banner-content {
  width: 800px;
  display: inline-block;
  vertical-align: middle;
}

.bar-step {
  position: absolute;
  margin-top: -20px;
  z-index: 1;
  font-size: 12px;
}

.label-txt {
  float: left;
}

.label-line {
  float: right;
  background: #000;
  height: 50px;
  width: 1px;
  margin-left: 5px;
}

.label-percent {
  float: right;
  margin-left: 5px;
}

/* The Modal (background) */
.modal-old {
  display: none;
  position: fixed;
  z-index: 1050;
  padding-top: 35%;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
  background-color: rgba(0, 0, 0, 0.4);
}

.modal-mail {
  display: none;
  position: fixed;
  z-index: 15;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
  background-color: rgba(0, 0, 0, 0.4);
}

/* Animation */
@-webkit-keyframes animatetop {
  from {
    top: -500px;
    opacity: 0;
  }
  to {
    top: 0;
    opacity: 1;
  }
}

@keyframes animatetop {
  from {
    top: -500px;
    opacity: 0;
  }
  to {
    top: 0;
    opacity: 1;
  }
}

/* Close Button */
.close {
  color: red;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

/** Progress bar **/
#myProgressQM {
  width: 95%;
  background-color: #ddd;
  margin: auto;
  border-radius: 25px;
}

#myBarQM {
  width: 0%;
  height: 15px;
  background-color: #4CAF50;
  text-align: center;
  line-height: 15px;
  color: white;
  border-radius: 25px;
}

.myhide {
  display: none;
}

.clearable {
  background: #ffffff url(data:image/gif;base64,R0lGODlhBwAHAIAAAP///5KSkiH5BAAAAAAALAAAAAAHAAcAAAIMTICmsGrIXnLxuDMLADs=) no-repeat right -10px center;
  border: 1px solid #999;
  padding: 3px 18px 3px 4px;
  /* Use the same right padding (18) in jQ! */
  border-radius: 3px;
  transition: background 0.4s;
}

.clearable.x {
  background-position: right 5px center;
}

.clearable.onX {
  cursor: pointer;
}

.clearable::-ms-clear {
  display: none;
  width: 0;
  height: 0;
}

.margin-top05 {
  margin-top: 5px;
}

.margin-top01 {
  margin-top: 1px;
}

.margin-bottom05 {
  margin-bottom: 5px;
}

.margin-bottom03 {
  margin-bottom: 3px;
}

.margin-bottom01 {
  margin-bottom: 1px;
}

.margin-minus-bottom05 {
  margin-bottom: -5px;
}

.margin-minus-bottom03 {
  margin-bottom: -3px;
}

.margin-minus-bottom01 {
  margin-bottom: -1px;
}

.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front {
  background: rgba(198, 198, 198, 0.44);
  max-width: 50%;
}

.ui-menu-item-wrapper:hover {
  cursor: pointer;
  background: #0a6dcf;
}

.table-borderless > tbody > tr > td,
.table-borderless > tbody > tr > th,
.table-borderless > tfoot > tr > td,
.table-borderless > tfoot > tr > th,
.table-borderless > thead > tr > td,
.table-borderless > thead > tr > th {
  border: none;
}

/****************************************************************
 *
 * CSS Percentage Circle
 * Author: Andre Firchow
 *
*****************************************************************/
.rect-auto, .c100.p51 .slice, .c100.p52 .slice, .c100.p53 .slice, .c100.p54 .slice, .c100.p55 .slice, .c100.p56 .slice, .c100.p57 .slice, .c100.p58 .slice, .c100.p59 .slice, .c100.p60 .slice, .c100.p61 .slice, .c100.p62 .slice, .c100.p63 .slice, .c100.p64 .slice, .c100.p65 .slice, .c100.p66 .slice, .c100.p67 .slice, .c100.p68 .slice, .c100.p69 .slice, .c100.p70 .slice, .c100.p71 .slice, .c100.p72 .slice, .c100.p73 .slice, .c100.p74 .slice, .c100.p75 .slice, .c100.p76 .slice, .c100.p77 .slice, .c100.p78 .slice, .c100.p79 .slice, .c100.p80 .slice, .c100.p81 .slice, .c100.p82 .slice, .c100.p83 .slice, .c100.p84 .slice, .c100.p85 .slice, .c100.p86 .slice, .c100.p87 .slice, .c100.p88 .slice, .c100.p89 .slice, .c100.p90 .slice, .c100.p91 .slice, .c100.p92 .slice, .c100.p93 .slice, .c100.p94 .slice, .c100.p95 .slice, .c100.p96 .slice, .c100.p97 .slice, .c100.p98 .slice, .c100.p99 .slice, .c100.p100 .slice {
  clip: rect(auto, auto, auto, auto);
}

.pie, .c100 .bar, .c100.p51 .fill, .c100.p52 .fill, .c100.p53 .fill, .c100.p54 .fill, .c100.p55 .fill, .c100.p56 .fill, .c100.p57 .fill, .c100.p58 .fill, .c100.p59 .fill, .c100.p60 .fill, .c100.p61 .fill, .c100.p62 .fill, .c100.p63 .fill, .c100.p64 .fill, .c100.p65 .fill, .c100.p66 .fill, .c100.p67 .fill, .c100.p68 .fill, .c100.p69 .fill, .c100.p70 .fill, .c100.p71 .fill, .c100.p72 .fill, .c100.p73 .fill, .c100.p74 .fill, .c100.p75 .fill, .c100.p76 .fill, .c100.p77 .fill, .c100.p78 .fill, .c100.p79 .fill, .c100.p80 .fill, .c100.p81 .fill, .c100.p82 .fill, .c100.p83 .fill, .c100.p84 .fill, .c100.p85 .fill, .c100.p86 .fill, .c100.p87 .fill, .c100.p88 .fill, .c100.p89 .fill, .c100.p90 .fill, .c100.p91 .fill, .c100.p92 .fill, .c100.p93 .fill, .c100.p94 .fill, .c100.p95 .fill, .c100.p96 .fill, .c100.p97 .fill, .c100.p98 .fill, .c100.p99 .fill, .c100.p100 .fill {
  position: absolute;
  border: 0.08em solid #307bbb;
  width: 0.84em;
  height: 0.84em;
  clip: rect(0em, 0.5em, 1em, 0em);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}

.pie-fill, .c100.p51 .bar:after, .c100.p51 .fill, .c100.p52 .bar:after, .c100.p52 .fill, .c100.p53 .bar:after, .c100.p53 .fill, .c100.p54 .bar:after, .c100.p54 .fill, .c100.p55 .bar:after, .c100.p55 .fill, .c100.p56 .bar:after, .c100.p56 .fill, .c100.p57 .bar:after, .c100.p57 .fill, .c100.p58 .bar:after, .c100.p58 .fill, .c100.p59 .bar:after, .c100.p59 .fill, .c100.p60 .bar:after, .c100.p60 .fill, .c100.p61 .bar:after, .c100.p61 .fill, .c100.p62 .bar:after, .c100.p62 .fill, .c100.p63 .bar:after, .c100.p63 .fill, .c100.p64 .bar:after, .c100.p64 .fill, .c100.p65 .bar:after, .c100.p65 .fill, .c100.p66 .bar:after, .c100.p66 .fill, .c100.p67 .bar:after, .c100.p67 .fill, .c100.p68 .bar:after, .c100.p68 .fill, .c100.p69 .bar:after, .c100.p69 .fill, .c100.p70 .bar:after, .c100.p70 .fill, .c100.p71 .bar:after, .c100.p71 .fill, .c100.p72 .bar:after, .c100.p72 .fill, .c100.p73 .bar:after, .c100.p73 .fill, .c100.p74 .bar:after, .c100.p74 .fill, .c100.p75 .bar:after, .c100.p75 .fill, .c100.p76 .bar:after, .c100.p76 .fill, .c100.p77 .bar:after, .c100.p77 .fill, .c100.p78 .bar:after, .c100.p78 .fill, .c100.p79 .bar:after, .c100.p79 .fill, .c100.p80 .bar:after, .c100.p80 .fill, .c100.p81 .bar:after, .c100.p81 .fill, .c100.p82 .bar:after, .c100.p82 .fill, .c100.p83 .bar:after, .c100.p83 .fill, .c100.p84 .bar:after, .c100.p84 .fill, .c100.p85 .bar:after, .c100.p85 .fill, .c100.p86 .bar:after, .c100.p86 .fill, .c100.p87 .bar:after, .c100.p87 .fill, .c100.p88 .bar:after, .c100.p88 .fill, .c100.p89 .bar:after, .c100.p89 .fill, .c100.p90 .bar:after, .c100.p90 .fill, .c100.p91 .bar:after, .c100.p91 .fill, .c100.p92 .bar:after, .c100.p92 .fill, .c100.p93 .bar:after, .c100.p93 .fill, .c100.p94 .bar:after, .c100.p94 .fill, .c100.p95 .bar:after, .c100.p95 .fill, .c100.p96 .bar:after, .c100.p96 .fill, .c100.p97 .bar:after, .c100.p97 .fill, .c100.p98 .bar:after, .c100.p98 .fill, .c100.p99 .bar:after, .c100.p99 .fill, .c100.p100 .bar:after, .c100.p100 .fill {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.c100 {
  position: relative;
  font-size: 120px;
  width: 1em;
  height: 1em;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  float: left;
  margin: 0 0.1em 0.1em 0;
  background-color: #cccccc;
}

.c100 *, .c100 *:before, .c100 *:after {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

.c100.center {
  float: none;
  margin: 0 auto;
}

.c100.big {
  font-size: 240px;
}

.c100.small {
  font-size: 80px;
}

.c100 > span {
  position: absolute;
  width: 100%;
  z-index: 1;
  left: 0;
  top: 0;
  width: 5em;
  line-height: 5em;
  font-size: 0.2em;
  color: #cccccc;
  display: block;
  text-align: center;
  white-space: nowrap;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.c100:after {
  position: absolute;
  top: 0.08em;
  left: 0.08em;
  display: block;
  content: " ";
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  background-color: whitesmoke;
  width: 0.84em;
  height: 0.84em;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}

.c100 .slice {
  position: absolute;
  width: 1em;
  height: 1em;
  clip: rect(0em, 1em, 1em, 0.5em);
}

.c100.p1 .bar {
  -webkit-transform: rotate(3.6deg);
  -moz-transform: rotate(3.6deg);
  -ms-transform: rotate(3.6deg);
  -o-transform: rotate(3.6deg);
  transform: rotate(3.6deg);
}

.c100.p2 .bar {
  -webkit-transform: rotate(7.2deg);
  -moz-transform: rotate(7.2deg);
  -ms-transform: rotate(7.2deg);
  -o-transform: rotate(7.2deg);
  transform: rotate(7.2deg);
}

.c100.p3 .bar {
  -webkit-transform: rotate(10.8deg);
  -moz-transform: rotate(10.8deg);
  -ms-transform: rotate(10.8deg);
  -o-transform: rotate(10.8deg);
  transform: rotate(10.8deg);
}

.c100.p4 .bar {
  -webkit-transform: rotate(14.4deg);
  -moz-transform: rotate(14.4deg);
  -ms-transform: rotate(14.4deg);
  -o-transform: rotate(14.4deg);
  transform: rotate(14.4deg);
}

.c100.p5 .bar {
  -webkit-transform: rotate(18deg);
  -moz-transform: rotate(18deg);
  -ms-transform: rotate(18deg);
  -o-transform: rotate(18deg);
  transform: rotate(18deg);
}

.c100.p6 .bar {
  -webkit-transform: rotate(21.6deg);
  -moz-transform: rotate(21.6deg);
  -ms-transform: rotate(21.6deg);
  -o-transform: rotate(21.6deg);
  transform: rotate(21.6deg);
}

.c100.p7 .bar {
  -webkit-transform: rotate(25.2deg);
  -moz-transform: rotate(25.2deg);
  -ms-transform: rotate(25.2deg);
  -o-transform: rotate(25.2deg);
  transform: rotate(25.2deg);
}

.c100.p8 .bar {
  -webkit-transform: rotate(28.8deg);
  -moz-transform: rotate(28.8deg);
  -ms-transform: rotate(28.8deg);
  -o-transform: rotate(28.8deg);
  transform: rotate(28.8deg);
}

.c100.p9 .bar {
  -webkit-transform: rotate(32.4deg);
  -moz-transform: rotate(32.4deg);
  -ms-transform: rotate(32.4deg);
  -o-transform: rotate(32.4deg);
  transform: rotate(32.4deg);
}

.c100.p10 .bar {
  -webkit-transform: rotate(36deg);
  -moz-transform: rotate(36deg);
  -ms-transform: rotate(36deg);
  -o-transform: rotate(36deg);
  transform: rotate(36deg);
}

.c100.p11 .bar {
  -webkit-transform: rotate(39.6deg);
  -moz-transform: rotate(39.6deg);
  -ms-transform: rotate(39.6deg);
  -o-transform: rotate(39.6deg);
  transform: rotate(39.6deg);
}

.c100.p12 .bar {
  -webkit-transform: rotate(43.2deg);
  -moz-transform: rotate(43.2deg);
  -ms-transform: rotate(43.2deg);
  -o-transform: rotate(43.2deg);
  transform: rotate(43.2deg);
}

.c100.p13 .bar {
  -webkit-transform: rotate(46.8deg);
  -moz-transform: rotate(46.8deg);
  -ms-transform: rotate(46.8deg);
  -o-transform: rotate(46.8deg);
  transform: rotate(46.8deg);
}

.c100.p14 .bar {
  -webkit-transform: rotate(50.4deg);
  -moz-transform: rotate(50.4deg);
  -ms-transform: rotate(50.4deg);
  -o-transform: rotate(50.4deg);
  transform: rotate(50.4deg);
}

.c100.p15 .bar {
  -webkit-transform: rotate(54deg);
  -moz-transform: rotate(54deg);
  -ms-transform: rotate(54deg);
  -o-transform: rotate(54deg);
  transform: rotate(54deg);
}

.c100.p16 .bar {
  -webkit-transform: rotate(57.6deg);
  -moz-transform: rotate(57.6deg);
  -ms-transform: rotate(57.6deg);
  -o-transform: rotate(57.6deg);
  transform: rotate(57.6deg);
}

.c100.p17 .bar {
  -webkit-transform: rotate(61.2deg);
  -moz-transform: rotate(61.2deg);
  -ms-transform: rotate(61.2deg);
  -o-transform: rotate(61.2deg);
  transform: rotate(61.2deg);
}

.c100.p18 .bar {
  -webkit-transform: rotate(64.8deg);
  -moz-transform: rotate(64.8deg);
  -ms-transform: rotate(64.8deg);
  -o-transform: rotate(64.8deg);
  transform: rotate(64.8deg);
}

.c100.p19 .bar {
  -webkit-transform: rotate(68.4deg);
  -moz-transform: rotate(68.4deg);
  -ms-transform: rotate(68.4deg);
  -o-transform: rotate(68.4deg);
  transform: rotate(68.4deg);
}

.c100.p20 .bar {
  -webkit-transform: rotate(72deg);
  -moz-transform: rotate(72deg);
  -ms-transform: rotate(72deg);
  -o-transform: rotate(72deg);
  transform: rotate(72deg);
}

.c100.p21 .bar {
  -webkit-transform: rotate(75.6deg);
  -moz-transform: rotate(75.6deg);
  -ms-transform: rotate(75.6deg);
  -o-transform: rotate(75.6deg);
  transform: rotate(75.6deg);
}

.c100.p22 .bar {
  -webkit-transform: rotate(79.2deg);
  -moz-transform: rotate(79.2deg);
  -ms-transform: rotate(79.2deg);
  -o-transform: rotate(79.2deg);
  transform: rotate(79.2deg);
}

.c100.p23 .bar {
  -webkit-transform: rotate(82.8deg);
  -moz-transform: rotate(82.8deg);
  -ms-transform: rotate(82.8deg);
  -o-transform: rotate(82.8deg);
  transform: rotate(82.8deg);
}

.c100.p24 .bar {
  -webkit-transform: rotate(86.4deg);
  -moz-transform: rotate(86.4deg);
  -ms-transform: rotate(86.4deg);
  -o-transform: rotate(86.4deg);
  transform: rotate(86.4deg);
}

.c100.p25 .bar {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.c100.p26 .bar {
  -webkit-transform: rotate(93.6deg);
  -moz-transform: rotate(93.6deg);
  -ms-transform: rotate(93.6deg);
  -o-transform: rotate(93.6deg);
  transform: rotate(93.6deg);
}

.c100.p27 .bar {
  -webkit-transform: rotate(97.2deg);
  -moz-transform: rotate(97.2deg);
  -ms-transform: rotate(97.2deg);
  -o-transform: rotate(97.2deg);
  transform: rotate(97.2deg);
}

.c100.p28 .bar {
  -webkit-transform: rotate(100.8deg);
  -moz-transform: rotate(100.8deg);
  -ms-transform: rotate(100.8deg);
  -o-transform: rotate(100.8deg);
  transform: rotate(100.8deg);
}

.c100.p29 .bar {
  -webkit-transform: rotate(104.4deg);
  -moz-transform: rotate(104.4deg);
  -ms-transform: rotate(104.4deg);
  -o-transform: rotate(104.4deg);
  transform: rotate(104.4deg);
}

.c100.p30 .bar {
  -webkit-transform: rotate(108deg);
  -moz-transform: rotate(108deg);
  -ms-transform: rotate(108deg);
  -o-transform: rotate(108deg);
  transform: rotate(108deg);
}

.c100.p31 .bar {
  -webkit-transform: rotate(111.6deg);
  -moz-transform: rotate(111.6deg);
  -ms-transform: rotate(111.6deg);
  -o-transform: rotate(111.6deg);
  transform: rotate(111.6deg);
}

.c100.p32 .bar {
  -webkit-transform: rotate(115.2deg);
  -moz-transform: rotate(115.2deg);
  -ms-transform: rotate(115.2deg);
  -o-transform: rotate(115.2deg);
  transform: rotate(115.2deg);
}

.c100.p33 .bar {
  -webkit-transform: rotate(118.8deg);
  -moz-transform: rotate(118.8deg);
  -ms-transform: rotate(118.8deg);
  -o-transform: rotate(118.8deg);
  transform: rotate(118.8deg);
}

.c100.p34 .bar {
  -webkit-transform: rotate(122.4deg);
  -moz-transform: rotate(122.4deg);
  -ms-transform: rotate(122.4deg);
  -o-transform: rotate(122.4deg);
  transform: rotate(122.4deg);
}

.c100.p35 .bar {
  -webkit-transform: rotate(126deg);
  -moz-transform: rotate(126deg);
  -ms-transform: rotate(126deg);
  -o-transform: rotate(126deg);
  transform: rotate(126deg);
}

.c100.p36 .bar {
  -webkit-transform: rotate(129.6deg);
  -moz-transform: rotate(129.6deg);
  -ms-transform: rotate(129.6deg);
  -o-transform: rotate(129.6deg);
  transform: rotate(129.6deg);
}

.c100.p37 .bar {
  -webkit-transform: rotate(133.2deg);
  -moz-transform: rotate(133.2deg);
  -ms-transform: rotate(133.2deg);
  -o-transform: rotate(133.2deg);
  transform: rotate(133.2deg);
}

.c100.p38 .bar {
  -webkit-transform: rotate(136.8deg);
  -moz-transform: rotate(136.8deg);
  -ms-transform: rotate(136.8deg);
  -o-transform: rotate(136.8deg);
  transform: rotate(136.8deg);
}

.c100.p39 .bar {
  -webkit-transform: rotate(140.4deg);
  -moz-transform: rotate(140.4deg);
  -ms-transform: rotate(140.4deg);
  -o-transform: rotate(140.4deg);
  transform: rotate(140.4deg);
}

.c100.p40 .bar {
  -webkit-transform: rotate(144deg);
  -moz-transform: rotate(144deg);
  -ms-transform: rotate(144deg);
  -o-transform: rotate(144deg);
  transform: rotate(144deg);
}

.c100.p41 .bar {
  -webkit-transform: rotate(147.6deg);
  -moz-transform: rotate(147.6deg);
  -ms-transform: rotate(147.6deg);
  -o-transform: rotate(147.6deg);
  transform: rotate(147.6deg);
}

.c100.p42 .bar {
  -webkit-transform: rotate(151.2deg);
  -moz-transform: rotate(151.2deg);
  -ms-transform: rotate(151.2deg);
  -o-transform: rotate(151.2deg);
  transform: rotate(151.2deg);
}

.c100.p43 .bar {
  -webkit-transform: rotate(154.8deg);
  -moz-transform: rotate(154.8deg);
  -ms-transform: rotate(154.8deg);
  -o-transform: rotate(154.8deg);
  transform: rotate(154.8deg);
}

.c100.p44 .bar {
  -webkit-transform: rotate(158.4deg);
  -moz-transform: rotate(158.4deg);
  -ms-transform: rotate(158.4deg);
  -o-transform: rotate(158.4deg);
  transform: rotate(158.4deg);
}

.c100.p45 .bar {
  -webkit-transform: rotate(162deg);
  -moz-transform: rotate(162deg);
  -ms-transform: rotate(162deg);
  -o-transform: rotate(162deg);
  transform: rotate(162deg);
}

.c100.p46 .bar {
  -webkit-transform: rotate(165.6deg);
  -moz-transform: rotate(165.6deg);
  -ms-transform: rotate(165.6deg);
  -o-transform: rotate(165.6deg);
  transform: rotate(165.6deg);
}

.c100.p47 .bar {
  -webkit-transform: rotate(169.2deg);
  -moz-transform: rotate(169.2deg);
  -ms-transform: rotate(169.2deg);
  -o-transform: rotate(169.2deg);
  transform: rotate(169.2deg);
}

.c100.p48 .bar {
  -webkit-transform: rotate(172.8deg);
  -moz-transform: rotate(172.8deg);
  -ms-transform: rotate(172.8deg);
  -o-transform: rotate(172.8deg);
  transform: rotate(172.8deg);
}

.c100.p49 .bar {
  -webkit-transform: rotate(176.4deg);
  -moz-transform: rotate(176.4deg);
  -ms-transform: rotate(176.4deg);
  -o-transform: rotate(176.4deg);
  transform: rotate(176.4deg);
}

.c100.p50 .bar {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.c100.p51 .bar {
  -webkit-transform: rotate(183.6deg);
  -moz-transform: rotate(183.6deg);
  -ms-transform: rotate(183.6deg);
  -o-transform: rotate(183.6deg);
  transform: rotate(183.6deg);
}

.c100.p52 .bar {
  -webkit-transform: rotate(187.2deg);
  -moz-transform: rotate(187.2deg);
  -ms-transform: rotate(187.2deg);
  -o-transform: rotate(187.2deg);
  transform: rotate(187.2deg);
}

.c100.p53 .bar {
  -webkit-transform: rotate(190.8deg);
  -moz-transform: rotate(190.8deg);
  -ms-transform: rotate(190.8deg);
  -o-transform: rotate(190.8deg);
  transform: rotate(190.8deg);
}

.c100.p54 .bar {
  -webkit-transform: rotate(194.4deg);
  -moz-transform: rotate(194.4deg);
  -ms-transform: rotate(194.4deg);
  -o-transform: rotate(194.4deg);
  transform: rotate(194.4deg);
}

.c100.p55 .bar {
  -webkit-transform: rotate(198deg);
  -moz-transform: rotate(198deg);
  -ms-transform: rotate(198deg);
  -o-transform: rotate(198deg);
  transform: rotate(198deg);
}

.c100.p56 .bar {
  -webkit-transform: rotate(201.6deg);
  -moz-transform: rotate(201.6deg);
  -ms-transform: rotate(201.6deg);
  -o-transform: rotate(201.6deg);
  transform: rotate(201.6deg);
}

.c100.p57 .bar {
  -webkit-transform: rotate(205.2deg);
  -moz-transform: rotate(205.2deg);
  -ms-transform: rotate(205.2deg);
  -o-transform: rotate(205.2deg);
  transform: rotate(205.2deg);
}

.c100.p58 .bar {
  -webkit-transform: rotate(208.8deg);
  -moz-transform: rotate(208.8deg);
  -ms-transform: rotate(208.8deg);
  -o-transform: rotate(208.8deg);
  transform: rotate(208.8deg);
}

.c100.p59 .bar {
  -webkit-transform: rotate(212.4deg);
  -moz-transform: rotate(212.4deg);
  -ms-transform: rotate(212.4deg);
  -o-transform: rotate(212.4deg);
  transform: rotate(212.4deg);
}

.c100.p60 .bar {
  -webkit-transform: rotate(216deg);
  -moz-transform: rotate(216deg);
  -ms-transform: rotate(216deg);
  -o-transform: rotate(216deg);
  transform: rotate(216deg);
}

.c100.p61 .bar {
  -webkit-transform: rotate(219.6deg);
  -moz-transform: rotate(219.6deg);
  -ms-transform: rotate(219.6deg);
  -o-transform: rotate(219.6deg);
  transform: rotate(219.6deg);
}

.c100.p62 .bar {
  -webkit-transform: rotate(223.2deg);
  -moz-transform: rotate(223.2deg);
  -ms-transform: rotate(223.2deg);
  -o-transform: rotate(223.2deg);
  transform: rotate(223.2deg);
}

.c100.p63 .bar {
  -webkit-transform: rotate(226.8deg);
  -moz-transform: rotate(226.8deg);
  -ms-transform: rotate(226.8deg);
  -o-transform: rotate(226.8deg);
  transform: rotate(226.8deg);
}

.c100.p64 .bar {
  -webkit-transform: rotate(230.4deg);
  -moz-transform: rotate(230.4deg);
  -ms-transform: rotate(230.4deg);
  -o-transform: rotate(230.4deg);
  transform: rotate(230.4deg);
}

.c100.p65 .bar {
  -webkit-transform: rotate(234deg);
  -moz-transform: rotate(234deg);
  -ms-transform: rotate(234deg);
  -o-transform: rotate(234deg);
  transform: rotate(234deg);
}

.c100.p66 .bar {
  -webkit-transform: rotate(237.6deg);
  -moz-transform: rotate(237.6deg);
  -ms-transform: rotate(237.6deg);
  -o-transform: rotate(237.6deg);
  transform: rotate(237.6deg);
}

.c100.p67 .bar {
  -webkit-transform: rotate(241.2deg);
  -moz-transform: rotate(241.2deg);
  -ms-transform: rotate(241.2deg);
  -o-transform: rotate(241.2deg);
  transform: rotate(241.2deg);
}

.c100.p68 .bar {
  -webkit-transform: rotate(244.8deg);
  -moz-transform: rotate(244.8deg);
  -ms-transform: rotate(244.8deg);
  -o-transform: rotate(244.8deg);
  transform: rotate(244.8deg);
}

.c100.p69 .bar {
  -webkit-transform: rotate(248.4deg);
  -moz-transform: rotate(248.4deg);
  -ms-transform: rotate(248.4deg);
  -o-transform: rotate(248.4deg);
  transform: rotate(248.4deg);
}

.c100.p70 .bar {
  -webkit-transform: rotate(252deg);
  -moz-transform: rotate(252deg);
  -ms-transform: rotate(252deg);
  -o-transform: rotate(252deg);
  transform: rotate(252deg);
}

.c100.p71 .bar {
  -webkit-transform: rotate(255.6deg);
  -moz-transform: rotate(255.6deg);
  -ms-transform: rotate(255.6deg);
  -o-transform: rotate(255.6deg);
  transform: rotate(255.6deg);
}

.c100.p72 .bar {
  -webkit-transform: rotate(259.2deg);
  -moz-transform: rotate(259.2deg);
  -ms-transform: rotate(259.2deg);
  -o-transform: rotate(259.2deg);
  transform: rotate(259.2deg);
}

.c100.p73 .bar {
  -webkit-transform: rotate(262.8deg);
  -moz-transform: rotate(262.8deg);
  -ms-transform: rotate(262.8deg);
  -o-transform: rotate(262.8deg);
  transform: rotate(262.8deg);
}

.c100.p74 .bar {
  -webkit-transform: rotate(266.4deg);
  -moz-transform: rotate(266.4deg);
  -ms-transform: rotate(266.4deg);
  -o-transform: rotate(266.4deg);
  transform: rotate(266.4deg);
}

.c100.p75 .bar {
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}

.c100.p76 .bar {
  -webkit-transform: rotate(273.6deg);
  -moz-transform: rotate(273.6deg);
  -ms-transform: rotate(273.6deg);
  -o-transform: rotate(273.6deg);
  transform: rotate(273.6deg);
}

.c100.p77 .bar {
  -webkit-transform: rotate(277.2deg);
  -moz-transform: rotate(277.2deg);
  -ms-transform: rotate(277.2deg);
  -o-transform: rotate(277.2deg);
  transform: rotate(277.2deg);
}

.c100.p78 .bar {
  -webkit-transform: rotate(280.8deg);
  -moz-transform: rotate(280.8deg);
  -ms-transform: rotate(280.8deg);
  -o-transform: rotate(280.8deg);
  transform: rotate(280.8deg);
}

.c100.p79 .bar {
  -webkit-transform: rotate(284.4deg);
  -moz-transform: rotate(284.4deg);
  -ms-transform: rotate(284.4deg);
  -o-transform: rotate(284.4deg);
  transform: rotate(284.4deg);
}

.c100.p80 .bar {
  -webkit-transform: rotate(288deg);
  -moz-transform: rotate(288deg);
  -ms-transform: rotate(288deg);
  -o-transform: rotate(288deg);
  transform: rotate(288deg);
}

.c100.p81 .bar {
  -webkit-transform: rotate(291.6deg);
  -moz-transform: rotate(291.6deg);
  -ms-transform: rotate(291.6deg);
  -o-transform: rotate(291.6deg);
  transform: rotate(291.6deg);
}

.c100.p82 .bar {
  -webkit-transform: rotate(295.2deg);
  -moz-transform: rotate(295.2deg);
  -ms-transform: rotate(295.2deg);
  -o-transform: rotate(295.2deg);
  transform: rotate(295.2deg);
}

.c100.p83 .bar {
  -webkit-transform: rotate(298.8deg);
  -moz-transform: rotate(298.8deg);
  -ms-transform: rotate(298.8deg);
  -o-transform: rotate(298.8deg);
  transform: rotate(298.8deg);
}

.c100.p84 .bar {
  -webkit-transform: rotate(302.4deg);
  -moz-transform: rotate(302.4deg);
  -ms-transform: rotate(302.4deg);
  -o-transform: rotate(302.4deg);
  transform: rotate(302.4deg);
}

.c100.p85 .bar {
  -webkit-transform: rotate(306deg);
  -moz-transform: rotate(306deg);
  -ms-transform: rotate(306deg);
  -o-transform: rotate(306deg);
  transform: rotate(306deg);
}

.c100.p86 .bar {
  -webkit-transform: rotate(309.6deg);
  -moz-transform: rotate(309.6deg);
  -ms-transform: rotate(309.6deg);
  -o-transform: rotate(309.6deg);
  transform: rotate(309.6deg);
}

.c100.p87 .bar {
  -webkit-transform: rotate(313.2deg);
  -moz-transform: rotate(313.2deg);
  -ms-transform: rotate(313.2deg);
  -o-transform: rotate(313.2deg);
  transform: rotate(313.2deg);
}

.c100.p88 .bar {
  -webkit-transform: rotate(316.8deg);
  -moz-transform: rotate(316.8deg);
  -ms-transform: rotate(316.8deg);
  -o-transform: rotate(316.8deg);
  transform: rotate(316.8deg);
}

.c100.p89 .bar {
  -webkit-transform: rotate(320.4deg);
  -moz-transform: rotate(320.4deg);
  -ms-transform: rotate(320.4deg);
  -o-transform: rotate(320.4deg);
  transform: rotate(320.4deg);
}

.c100.p90 .bar {
  -webkit-transform: rotate(324deg);
  -moz-transform: rotate(324deg);
  -ms-transform: rotate(324deg);
  -o-transform: rotate(324deg);
  transform: rotate(324deg);
}

.c100.p91 .bar {
  -webkit-transform: rotate(327.6deg);
  -moz-transform: rotate(327.6deg);
  -ms-transform: rotate(327.6deg);
  -o-transform: rotate(327.6deg);
  transform: rotate(327.6deg);
}

.c100.p92 .bar {
  -webkit-transform: rotate(331.2deg);
  -moz-transform: rotate(331.2deg);
  -ms-transform: rotate(331.2deg);
  -o-transform: rotate(331.2deg);
  transform: rotate(331.2deg);
}

.c100.p93 .bar {
  -webkit-transform: rotate(334.8deg);
  -moz-transform: rotate(334.8deg);
  -ms-transform: rotate(334.8deg);
  -o-transform: rotate(334.8deg);
  transform: rotate(334.8deg);
}

.c100.p94 .bar {
  -webkit-transform: rotate(338.4deg);
  -moz-transform: rotate(338.4deg);
  -ms-transform: rotate(338.4deg);
  -o-transform: rotate(338.4deg);
  transform: rotate(338.4deg);
}

.c100.p95 .bar {
  -webkit-transform: rotate(342deg);
  -moz-transform: rotate(342deg);
  -ms-transform: rotate(342deg);
  -o-transform: rotate(342deg);
  transform: rotate(342deg);
}

.c100.p96 .bar {
  -webkit-transform: rotate(345.6deg);
  -moz-transform: rotate(345.6deg);
  -ms-transform: rotate(345.6deg);
  -o-transform: rotate(345.6deg);
  transform: rotate(345.6deg);
}

.c100.p97 .bar {
  -webkit-transform: rotate(349.2deg);
  -moz-transform: rotate(349.2deg);
  -ms-transform: rotate(349.2deg);
  -o-transform: rotate(349.2deg);
  transform: rotate(349.2deg);
}

.c100.p98 .bar {
  -webkit-transform: rotate(352.8deg);
  -moz-transform: rotate(352.8deg);
  -ms-transform: rotate(352.8deg);
  -o-transform: rotate(352.8deg);
  transform: rotate(352.8deg);
}

.c100.p99 .bar {
  -webkit-transform: rotate(356.4deg);
  -moz-transform: rotate(356.4deg);
  -ms-transform: rotate(356.4deg);
  -o-transform: rotate(356.4deg);
  transform: rotate(356.4deg);
}

.c100.p100 .bar {
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  transform: rotate(360deg);
}

.c100:hover {
  cursor: default;
}

.c100:hover > span {
  width: 3.33em;
  line-height: 3.33em;
  font-size: 0.3em;
  color: #307bbb;
}

.c100:hover:after {
  top: 0.04em;
  left: 0.04em;
  width: 0.92em;
  height: 0.92em;
}

.c100.dark {
  background-color: #777777;
}

.c100.dark .bar,
.c100.dark .fill {
  border-color: #c6ff00 !important;
}

.c100.dark > span {
  color: #777777;
}

.c100.dark:after {
  background-color: #666666;
}

.c100.dark:hover > span {
  color: #c6ff00;
}

.c100.green .bar, .c100.green .fill {
  border-color: #4db53c !important;
}

.c100.green:hover > span {
  color: #4db53c;
}

.c100.green.dark .bar, .c100.green.dark .fill {
  border-color: #5fd400 !important;
}

.c100.green.dark:hover > span {
  color: #5fd400;
}

.c100.purple .bar, .c100.purple .fill {
  border-color: #800080 !important;
}

.c100.purple:hover > span {
  color: #800080;
}

.c100.purple.dark .bar, .c100.purple.dark .fill {
  border-color: #8B008B !important;
}

.c100.purple.dark:hover > span {
  color: #8B008B;
}

.c100.orange .bar, .c100.orange .fill {
  border-color: #dd9d22 !important;
}

.c100.orange:hover > span {
  color: #dd9d22;
}

.c100.orange.dark .bar, .c100.orange.dark .fill {
  border-color: #e08833 !important;
}

.c100.orange.dark:hover > span {
  color: #e08833;
}

table.customSpace01.dataTable tbody tr:hover {
  background-color: rgba(154, 207, 234, 0.25);
}

table.customSpace01.dataTable tbody tr:hover > .sorting_1 {
  background-color: rgba(154, 207, 234, 0.25);
}

table.customSpace01.dataTable tbody tr > td {
  padding: 5px;
}

table.customSpace01 tbody tr > td {
  padding: 5px;
}

.orangeBorder {
  border: 1px solid #fe7500;
}

.float-left {
  float: left !important;
}

.float-right {
  float: right !important;
}

.a3573393 {
  width: 100%;
  height: 100%;
  max-height: 100%;
}

.d-none {
  width: 100%;
  display: none;
}

.p05em {
  padding: 0.5em;
}

.w500 {
  width: 500px;
  max-width: 500px;
}

.__form__input__ {
  /*
    Auto Complete
  */
}

.pqrs-2nd-icon {
  position: absolute;
  font-size: 26px;
  margin-left: -19px;
  color: #d0681e;
}

.text-small {
  font-size: xx-small;
}

.cSizeCheckbox {
  /* Double-sized Checkboxes */
  -ms-transform: scale(1.5);
  /* IE */
  -moz-transform: scale(1.5);
  /* FF */
  -webkit-transform: scale(1.5);
  /* Safari and Chrome */
  -o-transform: scale(1.5);
  /* Opera */
  position: relative !important;
  cursor: pointer;
}

.not-reporting-text-dsh {
  margin-top: 14px;
  margin-left: -85px;
  position: absolute;
}

.mouse-hover-row:hover {
  background-color: rgba(0, 255, 0, 0.2) !important;
}

.bg-info-hover:hover {
  background-color: rgba(120, 199, 239, 0.25) !important;
}

.bg-info-border-hover:hover {
  background-color: rgba(120, 199, 239, 0.25) !important;
  border: 1px solid #337ab7;
  border-radius: 30px;
}


.dsh-cat-hover {
  padding-top: 8px;
  padding-left: 8px;
  background-color: #fff;
  border: 1px solid #333;
  --darkreader-inline-bgcolor: rgba(120, 199, 239, 0.25);
}

.dsh-cat-hover:hover {
  cursor: pointer;
  background-color: #f5f5f5;
  --darkreader-inline-bgcolor: rgba(120, 199, 239, 0.45);
}

.cat-sel-icons-dsh {
  font-size: large;
}

span.cat-sel-icons-dsh {
  display: inline-block;
  min-width: 1em;
  min-height: 1em;
}

button.cat-sel-icons-dsh {
  margin: 0;
  position: absolute;
  -ms-transform: translateY(37%);
  transform: translateY(37%);
}

.p-0 {
  padding: 0px;
}

.p-1 {
  padding: 1px;
}

.p-2 {
  padding: 2px;
}

.p-3 {
  padding: 3px;
}

.p-4 {
  padding: 4px;
}

.p-5 {
  padding: 5px;
}

.p-6 {
  padding: 6px;
}

.p-7 {
  padding: 7px;
}

.p-8 {
  padding: 8px;
}

.p-9 {
  padding: 9px;
}

.p-10 {
  padding: 10px;
}

.p-11 {
  padding: 11px;
}

.p-12 {
  padding: 12px;
}

.p-13 {
  padding: 13px;
}

.p-14 {
  padding: 14px;
}

.p-15 {
  padding: 15px;
}

.p-16 {
  padding: 16px;
}

.p-17 {
  padding: 17px;
}

.p-18 {
  padding: 18px;
}

.p-19 {
  padding: 19px;
}

.p-20 {
  padding: 20px;
}

.p-21 {
  padding: 21px;
}

.p-22 {
  padding: 22px;
}

.p-23 {
  padding: 23px;
}

.p-24 {
  padding: 24px;
}

.p-25 {
  padding: 25px;
}

.p-26 {
  padding: 26px;
}

.p-27 {
  padding: 27px;
}

.p-28 {
  padding: 28px;
}

.p-29 {
  padding: 29px;
}

.p-30 {
  padding: 30px;
}

.p-31 {
  padding: 31px;
}

.p-32 {
  padding: 32px;
}

.p-33 {
  padding: 33px;
}

.p-34 {
  padding: 34px;
}

.p-35 {
  padding: 35px;
}

.p-36 {
  padding: 36px;
}

.p-37 {
  padding: 37px;
}

.p-38 {
  padding: 38px;
}

.p-39 {
  padding: 39px;
}

.p-40 {
  padding: 40px;
}

.p-41 {
  padding: 41px;
}

.p-42 {
  padding: 42px;
}

.p-43 {
  padding: 43px;
}

.p-44 {
  padding: 44px;
}

.p-45 {
  padding: 45px;
}

.p-46 {
  padding: 46px;
}

.p-47 {
  padding: 47px;
}

.p-48 {
  padding: 48px;
}

.p-49 {
  padding: 49px;
}

.p-50 {
  padding: 50px;
}

.p-51 {
  padding: 51px;
}

.p-52 {
  padding: 52px;
}

.p-53 {
  padding: 53px;
}

.p-54 {
  padding: 54px;
}

.p-55 {
  padding: 55px;
}

.p-56 {
  padding: 56px;
}

.p-57 {
  padding: 57px;
}

.p-58 {
  padding: 58px;
}

.p-59 {
  padding: 59px;
}

.p-60 {
  padding: 60px;
}

.p-61 {
  padding: 61px;
}

.p-62 {
  padding: 62px;
}

.p-63 {
  padding: 63px;
}

.p-64 {
  padding: 64px;
}

.p-65 {
  padding: 65px;
}

.p-66 {
  padding: 66px;
}

.p-67 {
  padding: 67px;
}

.p-68 {
  padding: 68px;
}

.p-69 {
  padding: 69px;
}

.p-70 {
  padding: 70px;
}

.p-71 {
  padding: 71px;
}

.p-72 {
  padding: 72px;
}

.p-73 {
  padding: 73px;
}

.p-74 {
  padding: 74px;
}

.p-75 {
  padding: 75px;
}

.pt-0 {
  padding-top: 0px;
}

.pt-1 {
  padding-top: 1px;
}

.pt-2 {
  padding-top: 2px;
}

.pt-3 {
  padding-top: 3px;
}

.pt-4 {
  padding-top: 4px;
}

.pt-5 {
  padding-top: 5px;
}

.pt-6 {
  padding-top: 6px;
}

.pt-7 {
  padding-top: 7px;
}

.pt-8 {
  padding-top: 8px;
}

.pt-9 {
  padding-top: 9px;
}

.pt-10 {
  padding-top: 10px;
}

.pt-11 {
  padding-top: 11px;
}

.pt-12 {
  padding-top: 12px;
}

.pt-13 {
  padding-top: 13px;
}

.pt-14 {
  padding-top: 14px;
}

.pt-15 {
  padding-top: 15px;
}

.pt-16 {
  padding-top: 16px;
}

.pt-17 {
  padding-top: 17px;
}

.pt-18 {
  padding-top: 18px;
}

.pt-19 {
  padding-top: 19px;
}

.pt-20 {
  padding-top: 20px;
}

.pt-21 {
  padding-top: 21px;
}

.pt-22 {
  padding-top: 22px;
}

.pt-23 {
  padding-top: 23px;
}

.pt-24 {
  padding-top: 24px;
}

.pt-25 {
  padding-top: 25px;
}

.pt-26 {
  padding-top: 26px;
}

.pt-27 {
  padding-top: 27px;
}

.pt-28 {
  padding-top: 28px;
}

.pt-29 {
  padding-top: 29px;
}

.pt-30 {
  padding-top: 30px;
}

.pt-31 {
  padding-top: 31px;
}

.pt-32 {
  padding-top: 32px;
}

.pt-33 {
  padding-top: 33px;
}

.pt-34 {
  padding-top: 34px;
}

.pt-35 {
  padding-top: 35px;
}

.pt-36 {
  padding-top: 36px;
}

.pt-37 {
  padding-top: 37px;
}

.pt-38 {
  padding-top: 38px;
}

.pt-39 {
  padding-top: 39px;
}

.pt-40 {
  padding-top: 40px;
}

.pt-41 {
  padding-top: 41px;
}

.pt-42 {
  padding-top: 42px;
}

.pt-43 {
  padding-top: 43px;
}

.pt-44 {
  padding-top: 44px;
}

.pt-45 {
  padding-top: 45px;
}

.pt-46 {
  padding-top: 46px;
}

.pt-47 {
  padding-top: 47px;
}

.pt-48 {
  padding-top: 48px;
}

.pt-49 {
  padding-top: 49px;
}

.pt-50 {
  padding-top: 50px;
}

.pt-51 {
  padding-top: 51px;
}

.pt-52 {
  padding-top: 52px;
}

.pt-53 {
  padding-top: 53px;
}

.pt-54 {
  padding-top: 54px;
}

.pt-55 {
  padding-top: 55px;
}

.pt-56 {
  padding-top: 56px;
}

.pt-57 {
  padding-top: 57px;
}

.pt-58 {
  padding-top: 58px;
}

.pt-59 {
  padding-top: 59px;
}

.pt-60 {
  padding-top: 60px;
}

.pt-61 {
  padding-top: 61px;
}

.pt-62 {
  padding-top: 62px;
}

.pt-63 {
  padding-top: 63px;
}

.pt-64 {
  padding-top: 64px;
}

.pt-65 {
  padding-top: 65px;
}

.pt-66 {
  padding-top: 66px;
}

.pt-67 {
  padding-top: 67px;
}

.pt-68 {
  padding-top: 68px;
}

.pt-69 {
  padding-top: 69px;
}

.pt-70 {
  padding-top: 70px;
}

.pt-71 {
  padding-top: 71px;
}

.pt-72 {
  padding-top: 72px;
}

.pt-73 {
  padding-top: 73px;
}

.pt-74 {
  padding-top: 74px;
}

.pt-75 {
  padding-top: 75px;
}

.pb-0 {
  padding-bottom: 0px;
}

.pb-1 {
  padding-bottom: 1px;
}

.pb-2 {
  padding-bottom: 2px;
}

.pb-3 {
  padding-bottom: 3px;
}

.pb-4 {
  padding-bottom: 4px;
}

.pb-5 {
  padding-bottom: 5px;
}

.pb-6 {
  padding-bottom: 6px;
}

.pb-7 {
  padding-bottom: 7px;
}

.pb-8 {
  padding-bottom: 8px;
}

.pb-9 {
  padding-bottom: 9px;
}

.pb-10 {
  padding-bottom: 10px;
}

.pb-11 {
  padding-bottom: 11px;
}

.pb-12 {
  padding-bottom: 12px;
}

.pb-13 {
  padding-bottom: 13px;
}

.pb-14 {
  padding-bottom: 14px;
}

.pb-15 {
  padding-bottom: 15px;
}

.pb-16 {
  padding-bottom: 16px;
}

.pb-17 {
  padding-bottom: 17px;
}

.pb-18 {
  padding-bottom: 18px;
}

.pb-19 {
  padding-bottom: 19px;
}

.pb-20 {
  padding-bottom: 20px;
}

.pb-21 {
  padding-bottom: 21px;
}

.pb-22 {
  padding-bottom: 22px;
}

.pb-23 {
  padding-bottom: 23px;
}

.pb-24 {
  padding-bottom: 24px;
}

.pb-25 {
  padding-bottom: 25px;
}

.pb-26 {
  padding-bottom: 26px;
}

.pb-27 {
  padding-bottom: 27px;
}

.pb-28 {
  padding-bottom: 28px;
}

.pb-29 {
  padding-bottom: 29px;
}

.pb-30 {
  padding-bottom: 30px;
}

.pb-31 {
  padding-bottom: 31px;
}

.pb-32 {
  padding-bottom: 32px;
}

.pb-33 {
  padding-bottom: 33px;
}

.pb-34 {
  padding-bottom: 34px;
}

.pb-35 {
  padding-bottom: 35px;
}

.pb-36 {
  padding-bottom: 36px;
}

.pb-37 {
  padding-bottom: 37px;
}

.pb-38 {
  padding-bottom: 38px;
}

.pb-39 {
  padding-bottom: 39px;
}

.pb-40 {
  padding-bottom: 40px;
}

.pb-41 {
  padding-bottom: 41px;
}

.pb-42 {
  padding-bottom: 42px;
}

.pb-43 {
  padding-bottom: 43px;
}

.pb-44 {
  padding-bottom: 44px;
}

.pb-45 {
  padding-bottom: 45px;
}

.pb-46 {
  padding-bottom: 46px;
}

.pb-47 {
  padding-bottom: 47px;
}

.pb-48 {
  padding-bottom: 48px;
}

.pb-49 {
  padding-bottom: 49px;
}

.pb-50 {
  padding-bottom: 50px;
}

.pb-51 {
  padding-bottom: 51px;
}

.pb-52 {
  padding-bottom: 52px;
}

.pb-53 {
  padding-bottom: 53px;
}

.pb-54 {
  padding-bottom: 54px;
}

.pb-55 {
  padding-bottom: 55px;
}

.pb-56 {
  padding-bottom: 56px;
}

.pb-57 {
  padding-bottom: 57px;
}

.pb-58 {
  padding-bottom: 58px;
}

.pb-59 {
  padding-bottom: 59px;
}

.pb-60 {
  padding-bottom: 60px;
}

.pb-61 {
  padding-bottom: 61px;
}

.pb-62 {
  padding-bottom: 62px;
}

.pb-63 {
  padding-bottom: 63px;
}

.pb-64 {
  padding-bottom: 64px;
}

.pb-65 {
  padding-bottom: 65px;
}

.pb-66 {
  padding-bottom: 66px;
}

.pb-67 {
  padding-bottom: 67px;
}

.pb-68 {
  padding-bottom: 68px;
}

.pb-69 {
  padding-bottom: 69px;
}

.pb-70 {
  padding-bottom: 70px;
}

.pb-71 {
  padding-bottom: 71px;
}

.pb-72 {
  padding-bottom: 72px;
}

.pb-73 {
  padding-bottom: 73px;
}

.pb-74 {
  padding-bottom: 74px;
}

.pb-75 {
  padding-bottom: 75px;
}

.pr-0 {
  padding-right: 0px;
}

.pr-1 {
  padding-right: 1px;
}

.pr-2 {
  padding-right: 2px;
}

.pr-3 {
  padding-right: 3px;
}

.pr-4 {
  padding-right: 4px;
}

.pr-5 {
  padding-right: 5px;
}

.pr-6 {
  padding-right: 6px;
}

.pr-7 {
  padding-right: 7px;
}

.pr-8 {
  padding-right: 8px;
}

.pr-9 {
  padding-right: 9px;
}

.pr-10 {
  padding-right: 10px;
}

.pr-11 {
  padding-right: 11px;
}

.pr-12 {
  padding-right: 12px;
}

.pr-13 {
  padding-right: 13px;
}

.pr-14 {
  padding-right: 14px;
}

.pr-15 {
  padding-right: 15px;
}

.pr-16 {
  padding-right: 16px;
}

.pr-17 {
  padding-right: 17px;
}

.pr-18 {
  padding-right: 18px;
}

.pr-19 {
  padding-right: 19px;
}

.pr-20 {
  padding-right: 20px;
}

.pr-21 {
  padding-right: 21px;
}

.pr-22 {
  padding-right: 22px;
}

.pr-23 {
  padding-right: 23px;
}

.pr-24 {
  padding-right: 24px;
}

.pr-25 {
  padding-right: 25px;
}

.pr-26 {
  padding-right: 26px;
}

.pr-27 {
  padding-right: 27px;
}

.pr-28 {
  padding-right: 28px;
}

.pr-29 {
  padding-right: 29px;
}

.pr-30 {
  padding-right: 30px;
}

.pr-31 {
  padding-right: 31px;
}

.pr-32 {
  padding-right: 32px;
}

.pr-33 {
  padding-right: 33px;
}

.pr-34 {
  padding-right: 34px;
}

.pr-35 {
  padding-right: 35px;
}

.pr-36 {
  padding-right: 36px;
}

.pr-37 {
  padding-right: 37px;
}

.pr-38 {
  padding-right: 38px;
}

.pr-39 {
  padding-right: 39px;
}

.pr-40 {
  padding-right: 40px;
}

.pr-41 {
  padding-right: 41px;
}

.pr-42 {
  padding-right: 42px;
}

.pr-43 {
  padding-right: 43px;
}

.pr-44 {
  padding-right: 44px;
}

.pr-45 {
  padding-right: 45px;
}

.pr-46 {
  padding-right: 46px;
}

.pr-47 {
  padding-right: 47px;
}

.pr-48 {
  padding-right: 48px;
}

.pr-49 {
  padding-right: 49px;
}

.pr-50 {
  padding-right: 50px;
}

.pr-51 {
  padding-right: 51px;
}

.pr-52 {
  padding-right: 52px;
}

.pr-53 {
  padding-right: 53px;
}

.pr-54 {
  padding-right: 54px;
}

.pr-55 {
  padding-right: 55px;
}

.pr-56 {
  padding-right: 56px;
}

.pr-57 {
  padding-right: 57px;
}

.pr-58 {
  padding-right: 58px;
}

.pr-59 {
  padding-right: 59px;
}

.pr-60 {
  padding-right: 60px;
}

.pr-61 {
  padding-right: 61px;
}

.pr-62 {
  padding-right: 62px;
}

.pr-63 {
  padding-right: 63px;
}

.pr-64 {
  padding-right: 64px;
}

.pr-65 {
  padding-right: 65px;
}

.pr-66 {
  padding-right: 66px;
}

.pr-67 {
  padding-right: 67px;
}

.pr-68 {
  padding-right: 68px;
}

.pr-69 {
  padding-right: 69px;
}

.pr-70 {
  padding-right: 70px;
}

.pr-71 {
  padding-right: 71px;
}

.pr-72 {
  padding-right: 72px;
}

.pr-73 {
  padding-right: 73px;
}

.pr-74 {
  padding-right: 74px;
}

.pr-75 {
  padding-right: 75px;
}

.pl-0 {
  padding-left: 0px;
}

.pl-1 {
  padding-left: 1px;
}

.pl-2 {
  padding-left: 2px;
}

.pl-3 {
  padding-left: 3px;
}

.pl-4 {
  padding-left: 4px;
}

.pl-5 {
  padding-left: 5px;
}

.pl-6 {
  padding-left: 6px;
}

.pl-7 {
  padding-left: 7px;
}

.pl-8 {
  padding-left: 8px;
}

.pl-9 {
  padding-left: 9px;
}

.pl-10 {
  padding-left: 10px;
}

.pl-11 {
  padding-left: 11px;
}

.pl-12 {
  padding-left: 12px;
}

.pl-13 {
  padding-left: 13px;
}

.pl-14 {
  padding-left: 14px;
}

.pl-15 {
  padding-left: 15px;
}

.pl-16 {
  padding-left: 16px;
}

.pl-17 {
  padding-left: 17px;
}

.pl-18 {
  padding-left: 18px;
}

.pl-19 {
  padding-left: 19px;
}

.pl-20 {
  padding-left: 20px;
}

.pl-21 {
  padding-left: 21px;
}

.pl-22 {
  padding-left: 22px;
}

.pl-23 {
  padding-left: 23px;
}

.pl-24 {
  padding-left: 24px;
}

.pl-25 {
  padding-left: 25px;
}

.pl-26 {
  padding-left: 26px;
}

.pl-27 {
  padding-left: 27px;
}

.pl-28 {
  padding-left: 28px;
}

.pl-29 {
  padding-left: 29px;
}

.pl-30 {
  padding-left: 30px;
}

.pl-31 {
  padding-left: 31px;
}

.pl-32 {
  padding-left: 32px;
}

.pl-33 {
  padding-left: 33px;
}

.pl-34 {
  padding-left: 34px;
}

.pl-35 {
  padding-left: 35px;
}

.pl-36 {
  padding-left: 36px;
}

.pl-37 {
  padding-left: 37px;
}

.pl-38 {
  padding-left: 38px;
}

.pl-39 {
  padding-left: 39px;
}

.pl-40 {
  padding-left: 40px;
}

.pl-41 {
  padding-left: 41px;
}

.pl-42 {
  padding-left: 42px;
}

.pl-43 {
  padding-left: 43px;
}

.pl-44 {
  padding-left: 44px;
}

.pl-45 {
  padding-left: 45px;
}

.pl-46 {
  padding-left: 46px;
}

.pl-47 {
  padding-left: 47px;
}

.pl-48 {
  padding-left: 48px;
}

.pl-49 {
  padding-left: 49px;
}

.pl-50 {
  padding-left: 50px;
}

.pl-51 {
  padding-left: 51px;
}

.pl-52 {
  padding-left: 52px;
}

.pl-53 {
  padding-left: 53px;
}

.pl-54 {
  padding-left: 54px;
}

.pl-55 {
  padding-left: 55px;
}

.pl-56 {
  padding-left: 56px;
}

.pl-57 {
  padding-left: 57px;
}

.pl-58 {
  padding-left: 58px;
}

.pl-59 {
  padding-left: 59px;
}

.pl-60 {
  padding-left: 60px;
}

.pl-61 {
  padding-left: 61px;
}

.pl-62 {
  padding-left: 62px;
}

.pl-63 {
  padding-left: 63px;
}

.pl-64 {
  padding-left: 64px;
}

.pl-65 {
  padding-left: 65px;
}

.pl-66 {
  padding-left: 66px;
}

.pl-67 {
  padding-left: 67px;
}

.pl-68 {
  padding-left: 68px;
}

.pl-69 {
  padding-left: 69px;
}

.pl-70 {
  padding-left: 70px;
}

.pl-71 {
  padding-left: 71px;
}

.pl-72 {
  padding-left: 72px;
}

.pl-73 {
  padding-left: 73px;
}

.pl-74 {
  padding-left: 74px;
}

.pl-75 {
  padding-left: 75px;
}

.m-0 {
  margin: 0px;
}

.m-1 {
  margin: 1px;
}

.m-2 {
  margin: 2px;
}

.m-3 {
  margin: 3px;
}

.m-4 {
  margin: 4px;
}

.m-5 {
  margin: 5px;
}

.m-6 {
  margin: 6px;
}

.m-7 {
  margin: 7px;
}

.m-8 {
  margin: 8px;
}

.m-9 {
  margin: 9px;
}

.m-10 {
  margin: 10px;
}

.m-11 {
  margin: 11px;
}

.m-12 {
  margin: 12px;
}

.m-13 {
  margin: 13px;
}

.m-14 {
  margin: 14px;
}

.m-15 {
  margin: 15px;
}

.m-16 {
  margin: 16px;
}

.m-17 {
  margin: 17px;
}

.m-18 {
  margin: 18px;
}

.m-19 {
  margin: 19px;
}

.m-20 {
  margin: 20px;
}

.m-21 {
  margin: 21px;
}

.m-22 {
  margin: 22px;
}

.m-23 {
  margin: 23px;
}

.m-24 {
  margin: 24px;
}

.m-25 {
  margin: 25px;
}

.m-26 {
  margin: 26px;
}

.m-27 {
  margin: 27px;
}

.m-28 {
  margin: 28px;
}

.m-29 {
  margin: 29px;
}

.m-30 {
  margin: 30px;
}

.m-31 {
  margin: 31px;
}

.m-32 {
  margin: 32px;
}

.m-33 {
  margin: 33px;
}

.m-34 {
  margin: 34px;
}

.m-35 {
  margin: 35px;
}

.m-36 {
  margin: 36px;
}

.m-37 {
  margin: 37px;
}

.m-38 {
  margin: 38px;
}

.m-39 {
  margin: 39px;
}

.m-40 {
  margin: 40px;
}

.m-41 {
  margin: 41px;
}

.m-42 {
  margin: 42px;
}

.m-43 {
  margin: 43px;
}

.m-44 {
  margin: 44px;
}

.m-45 {
  margin: 45px;
}

.m-46 {
  margin: 46px;
}

.m-47 {
  margin: 47px;
}

.m-48 {
  margin: 48px;
}

.m-49 {
  margin: 49px;
}

.m-50 {
  margin: 50px;
}

.m-51 {
  margin: 51px;
}

.m-52 {
  margin: 52px;
}

.m-53 {
  margin: 53px;
}

.m-54 {
  margin: 54px;
}

.m-55 {
  margin: 55px;
}

.m-56 {
  margin: 56px;
}

.m-57 {
  margin: 57px;
}

.m-58 {
  margin: 58px;
}

.m-59 {
  margin: 59px;
}

.m-60 {
  margin: 60px;
}

.m-61 {
  margin: 61px;
}

.m-62 {
  margin: 62px;
}

.m-63 {
  margin: 63px;
}

.m-64 {
  margin: 64px;
}

.m-65 {
  margin: 65px;
}

.m-66 {
  margin: 66px;
}

.m-67 {
  margin: 67px;
}

.m-68 {
  margin: 68px;
}

.m-69 {
  margin: 69px;
}

.m-70 {
  margin: 70px;
}

.m-71 {
  margin: 71px;
}

.m-72 {
  margin: 72px;
}

.m-73 {
  margin: 73px;
}

.m-74 {
  margin: 74px;
}

.m-75 {
  margin: 75px;
}

.mt-0 {
  margin-top: 0px;
}

.mt-1 {
  margin-top: 1px;
}

.mt-2 {
  margin-top: 2px;
}

.mt-3 {
  margin-top: 3px;
}

.mt-4 {
  margin-top: 4px;
}

.mt-5 {
  margin-top: 5px;
}

.mt-6 {
  margin-top: 6px;
}

.mt-7 {
  margin-top: 7px;
}

.mt-8 {
  margin-top: 8px;
}

.mt-9 {
  margin-top: 9px;
}

.mt-10 {
  margin-top: 10px;
}

.mt-11 {
  margin-top: 11px;
}

.mt-12 {
  margin-top: 12px;
}

.mt-13 {
  margin-top: 13px;
}

.mt-14 {
  margin-top: 14px;
}

.mt-15 {
  margin-top: 15px;
}

.mt-16 {
  margin-top: 16px;
}

.mt-17 {
  margin-top: 17px;
}

.mt-18 {
  margin-top: 18px;
}

.mt-19 {
  margin-top: 19px;
}

.mt-20 {
  margin-top: 20px;
}

.mt-21 {
  margin-top: 21px;
}

.mt-22 {
  margin-top: 22px;
}

.mt-23 {
  margin-top: 23px;
}

.mt-24 {
  margin-top: 24px;
}

.mt-25 {
  margin-top: 25px;
}

.mt-26 {
  margin-top: 26px;
}

.mt-27 {
  margin-top: 27px;
}

.mt-28 {
  margin-top: 28px;
}

.mt-29 {
  margin-top: 29px;
}

.mt-30 {
  margin-top: 30px;
}

.mt-31 {
  margin-top: 31px;
}

.mt-32 {
  margin-top: 32px;
}

.mt-33 {
  margin-top: 33px;
}

.mt-34 {
  margin-top: 34px;
}

.mt-35 {
  margin-top: 35px;
}

.mt-36 {
  margin-top: 36px;
}

.mt-37 {
  margin-top: 37px;
}

.mt-38 {
  margin-top: 38px;
}

.mt-39 {
  margin-top: 39px;
}

.mt-40 {
  margin-top: 40px;
}

.mt-41 {
  margin-top: 41px;
}

.mt-42 {
  margin-top: 42px;
}

.mt-43 {
  margin-top: 43px;
}

.mt-44 {
  margin-top: 44px;
}

.mt-45 {
  margin-top: 45px;
}

.mt-46 {
  margin-top: 46px;
}

.mt-47 {
  margin-top: 47px;
}

.mt-48 {
  margin-top: 48px;
}

.mt-49 {
  margin-top: 49px;
}

.mt-50 {
  margin-top: 50px;
}

.mt-51 {
  margin-top: 51px;
}

.mt-52 {
  margin-top: 52px;
}

.mt-53 {
  margin-top: 53px;
}

.mt-54 {
  margin-top: 54px;
}

.mt-55 {
  margin-top: 55px;
}

.mt-56 {
  margin-top: 56px;
}

.mt-57 {
  margin-top: 57px;
}

.mt-58 {
  margin-top: 58px;
}

.mt-59 {
  margin-top: 59px;
}

.mt-60 {
  margin-top: 60px;
}

.mt-61 {
  margin-top: 61px;
}

.mt-62 {
  margin-top: 62px;
}

.mt-63 {
  margin-top: 63px;
}

.mt-64 {
  margin-top: 64px;
}

.mt-65 {
  margin-top: 65px;
}

.mt-66 {
  margin-top: 66px;
}

.mt-67 {
  margin-top: 67px;
}

.mt-68 {
  margin-top: 68px;
}

.mt-69 {
  margin-top: 69px;
}

.mt-70 {
  margin-top: 70px;
}

.mt-71 {
  margin-top: 71px;
}

.mt-72 {
  margin-top: 72px;
}

.mt-73 {
  margin-top: 73px;
}

.mt-74 {
  margin-top: 74px;
}

.mt-75 {
  margin-top: 75px;
}

.mb-0 {
  margin-bottom: 0px;
}

.mb-1 {
  margin-bottom: 1px;
}

.mb-2 {
  margin-bottom: 2px;
}

.mb-3 {
  margin-bottom: 3px;
}

.mb-4 {
  margin-bottom: 4px;
}

.mb-5 {
  margin-bottom: 5px;
}

.mb-6 {
  margin-bottom: 6px;
}

.mb-7 {
  margin-bottom: 7px;
}

.mb-8 {
  margin-bottom: 8px;
}

.mb-9 {
  margin-bottom: 9px;
}

.mb-10 {
  margin-bottom: 10px;
}

.mb-11 {
  margin-bottom: 11px;
}

.mb-12 {
  margin-bottom: 12px;
}

.mb-13 {
  margin-bottom: 13px;
}

.mb-14 {
  margin-bottom: 14px;
}

.mb-15 {
  margin-bottom: 15px;
}

.mb-16 {
  margin-bottom: 16px;
}

.mb-17 {
  margin-bottom: 17px;
}

.mb-18 {
  margin-bottom: 18px;
}

.mb-19 {
  margin-bottom: 19px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-21 {
  margin-bottom: 21px;
}

.mb-22 {
  margin-bottom: 22px;
}

.mb-23 {
  margin-bottom: 23px;
}

.mb-24 {
  margin-bottom: 24px;
}

.mb-25 {
  margin-bottom: 25px;
}

.mb-26 {
  margin-bottom: 26px;
}

.mb-27 {
  margin-bottom: 27px;
}

.mb-28 {
  margin-bottom: 28px;
}

.mb-29 {
  margin-bottom: 29px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-31 {
  margin-bottom: 31px;
}

.mb-32 {
  margin-bottom: 32px;
}

.mb-33 {
  margin-bottom: 33px;
}

.mb-34 {
  margin-bottom: 34px;
}

.mb-35 {
  margin-bottom: 35px;
}

.mb-36 {
  margin-bottom: 36px;
}

.mb-37 {
  margin-bottom: 37px;
}

.mb-38 {
  margin-bottom: 38px;
}

.mb-39 {
  margin-bottom: 39px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-41 {
  margin-bottom: 41px;
}

.mb-42 {
  margin-bottom: 42px;
}

.mb-43 {
  margin-bottom: 43px;
}

.mb-44 {
  margin-bottom: 44px;
}

.mb-45 {
  margin-bottom: 45px;
}

.mb-46 {
  margin-bottom: 46px;
}

.mb-47 {
  margin-bottom: 47px;
}

.mb-48 {
  margin-bottom: 48px;
}

.mb-49 {
  margin-bottom: 49px;
}

.mb-50 {
  margin-bottom: 50px;
}

.mb-51 {
  margin-bottom: 51px;
}

.mb-52 {
  margin-bottom: 52px;
}

.mb-53 {
  margin-bottom: 53px;
}

.mb-54 {
  margin-bottom: 54px;
}

.mb-55 {
  margin-bottom: 55px;
}

.mb-56 {
  margin-bottom: 56px;
}

.mb-57 {
  margin-bottom: 57px;
}

.mb-58 {
  margin-bottom: 58px;
}

.mb-59 {
  margin-bottom: 59px;
}

.mb-60 {
  margin-bottom: 60px;
}

.mb-61 {
  margin-bottom: 61px;
}

.mb-62 {
  margin-bottom: 62px;
}

.mb-63 {
  margin-bottom: 63px;
}

.mb-64 {
  margin-bottom: 64px;
}

.mb-65 {
  margin-bottom: 65px;
}

.mb-66 {
  margin-bottom: 66px;
}

.mb-67 {
  margin-bottom: 67px;
}

.mb-68 {
  margin-bottom: 68px;
}

.mb-69 {
  margin-bottom: 69px;
}

.mb-70 {
  margin-bottom: 70px;
}

.mb-71 {
  margin-bottom: 71px;
}

.mb-72 {
  margin-bottom: 72px;
}

.mb-73 {
  margin-bottom: 73px;
}

.mb-74 {
  margin-bottom: 74px;
}

.mb-75 {
  margin-bottom: 75px;
}

.ml-0 {
  margin-left: 0px;
}

.ml-1 {
  margin-left: 1px;
}

.ml-2 {
  margin-left: 2px;
}

.ml-3 {
  margin-left: 3px;
}

.ml-4 {
  margin-left: 4px;
}

.ml-5 {
  margin-left: 5px;
}

.ml-6 {
  margin-left: 6px;
}

.ml-7 {
  margin-left: 7px;
}

.ml-8 {
  margin-left: 8px;
}

.ml-9 {
  margin-left: 9px;
}

.ml-10 {
  margin-left: 10px;
}

.ml-11 {
  margin-left: 11px;
}

.ml-12 {
  margin-left: 12px;
}

.ml-13 {
  margin-left: 13px;
}

.ml-14 {
  margin-left: 14px;
}

.ml-15 {
  margin-left: 15px;
}

.ml-16 {
  margin-left: 16px;
}

.ml-17 {
  margin-left: 17px;
}

.ml-18 {
  margin-left: 18px;
}

.ml-19 {
  margin-left: 19px;
}

.ml-20 {
  margin-left: 20px;
}

.ml-21 {
  margin-left: 21px;
}

.ml-22 {
  margin-left: 22px;
}

.ml-23 {
  margin-left: 23px;
}

.ml-24 {
  margin-left: 24px;
}

.ml-25 {
  margin-left: 25px;
}

.ml-26 {
  margin-left: 26px;
}

.ml-27 {
  margin-left: 27px;
}

.ml-28 {
  margin-left: 28px;
}

.ml-29 {
  margin-left: 29px;
}

.ml-30 {
  margin-left: 30px;
}

.ml-31 {
  margin-left: 31px;
}

.ml-32 {
  margin-left: 32px;
}

.ml-33 {
  margin-left: 33px;
}

.ml-34 {
  margin-left: 34px;
}

.ml-35 {
  margin-left: 35px;
}

.ml-36 {
  margin-left: 36px;
}

.ml-37 {
  margin-left: 37px;
}

.ml-38 {
  margin-left: 38px;
}

.ml-39 {
  margin-left: 39px;
}

.ml-40 {
  margin-left: 40px;
}

.ml-41 {
  margin-left: 41px;
}

.ml-42 {
  margin-left: 42px;
}

.ml-43 {
  margin-left: 43px;
}

.ml-44 {
  margin-left: 44px;
}

.ml-45 {
  margin-left: 45px;
}

.ml-46 {
  margin-left: 46px;
}

.ml-47 {
  margin-left: 47px;
}

.ml-48 {
  margin-left: 48px;
}

.ml-49 {
  margin-left: 49px;
}

.ml-50 {
  margin-left: 50px;
}

.ml-51 {
  margin-left: 51px;
}

.ml-52 {
  margin-left: 52px;
}

.ml-53 {
  margin-left: 53px;
}

.ml-54 {
  margin-left: 54px;
}

.ml-55 {
  margin-left: 55px;
}

.ml-56 {
  margin-left: 56px;
}

.ml-57 {
  margin-left: 57px;
}

.ml-58 {
  margin-left: 58px;
}

.ml-59 {
  margin-left: 59px;
}

.ml-60 {
  margin-left: 60px;
}

.ml-61 {
  margin-left: 61px;
}

.ml-62 {
  margin-left: 62px;
}

.ml-63 {
  margin-left: 63px;
}

.ml-64 {
  margin-left: 64px;
}

.ml-65 {
  margin-left: 65px;
}

.ml-66 {
  margin-left: 66px;
}

.ml-67 {
  margin-left: 67px;
}

.ml-68 {
  margin-left: 68px;
}

.ml-69 {
  margin-left: 69px;
}

.ml-70 {
  margin-left: 70px;
}

.ml-71 {
  margin-left: 71px;
}

.ml-72 {
  margin-left: 72px;
}

.ml-73 {
  margin-left: 73px;
}

.ml-74 {
  margin-left: 74px;
}

.ml-75 {
  margin-left: 75px;
}

.mr-0 {
  margin-right: 0px;
}

.mr-1 {
  margin-right: 1px;
}

.mr-2 {
  margin-right: 2px;
}

.mr-3 {
  margin-right: 3px;
}

.mr-4 {
  margin-right: 4px;
}

.mr-5 {
  margin-right: 5px;
}

.mr-6 {
  margin-right: 6px;
}

.mr-7 {
  margin-right: 7px;
}

.mr-8 {
  margin-right: 8px;
}

.mr-9 {
  margin-right: 9px;
}

.mr-10 {
  margin-right: 10px;
}

.mr-11 {
  margin-right: 11px;
}

.mr-12 {
  margin-right: 12px;
}

.mr-13 {
  margin-right: 13px;
}

.mr-14 {
  margin-right: 14px;
}

.mr-15 {
  margin-right: 15px;
}

.mr-16 {
  margin-right: 16px;
}

.mr-17 {
  margin-right: 17px;
}

.mr-18 {
  margin-right: 18px;
}

.mr-19 {
  margin-right: 19px;
}

.mr-20 {
  margin-right: 20px;
}

.mr-21 {
  margin-right: 21px;
}

.mr-22 {
  margin-right: 22px;
}

.mr-23 {
  margin-right: 23px;
}

.mr-24 {
  margin-right: 24px;
}

.mr-25 {
  margin-right: 25px;
}

.mr-26 {
  margin-right: 26px;
}

.mr-27 {
  margin-right: 27px;
}

.mr-28 {
  margin-right: 28px;
}

.mr-29 {
  margin-right: 29px;
}

.mr-30 {
  margin-right: 30px;
}

.mr-31 {
  margin-right: 31px;
}

.mr-32 {
  margin-right: 32px;
}

.mr-33 {
  margin-right: 33px;
}

.mr-34 {
  margin-right: 34px;
}

.mr-35 {
  margin-right: 35px;
}

.mr-36 {
  margin-right: 36px;
}

.mr-37 {
  margin-right: 37px;
}

.mr-38 {
  margin-right: 38px;
}

.mr-39 {
  margin-right: 39px;
}

.mr-40 {
  margin-right: 40px;
}

.mr-41 {
  margin-right: 41px;
}

.mr-42 {
  margin-right: 42px;
}

.mr-43 {
  margin-right: 43px;
}

.mr-44 {
  margin-right: 44px;
}

.mr-45 {
  margin-right: 45px;
}

.mr-46 {
  margin-right: 46px;
}

.mr-47 {
  margin-right: 47px;
}

.mr-48 {
  margin-right: 48px;
}

.mr-49 {
  margin-right: 49px;
}

.mr-50 {
  margin-right: 50px;
}

.mr-51 {
  margin-right: 51px;
}

.mr-52 {
  margin-right: 52px;
}

.mr-53 {
  margin-right: 53px;
}

.mr-54 {
  margin-right: 54px;
}

.mr-55 {
  margin-right: 55px;
}

.mr-56 {
  margin-right: 56px;
}

.mr-57 {
  margin-right: 57px;
}

.mr-58 {
  margin-right: 58px;
}

.mr-59 {
  margin-right: 59px;
}

.mr-60 {
  margin-right: 60px;
}

.mr-61 {
  margin-right: 61px;
}

.mr-62 {
  margin-right: 62px;
}

.mr-63 {
  margin-right: 63px;
}

.mr-64 {
  margin-right: 64px;
}

.mr-65 {
  margin-right: 65px;
}

.mr-66 {
  margin-right: 66px;
}

.mr-67 {
  margin-right: 67px;
}

.mr-68 {
  margin-right: 68px;
}

.mr-69 {
  margin-right: 69px;
}

.mr-70 {
  margin-right: 70px;
}

.mr-71 {
  margin-right: 71px;
}

.mr-72 {
  margin-right: 72px;
}

.mr-73 {
  margin-right: 73px;
}

.mr-74 {
  margin-right: 74px;
}

.mr-75 {
  margin-right: 75px;
}

.mt-m-0 {
  margin-top: -0px;
}

.mt-m-1 {
  margin-top: -1px;
}

.mt-m-2 {
  margin-top: -2px;
}

.mt-m-3 {
  margin-top: -3px;
}

.mt-m-4 {
  margin-top: -4px;
}

.mt-m-5 {
  margin-top: -5px;
}

.mt-m-6 {
  margin-top: -6px;
}

.mt-m-7 {
  margin-top: -7px;
}

.mt-m-8 {
  margin-top: -8px;
}

.mt-m-9 {
  margin-top: -9px;
}

.mt-m-10 {
  margin-top: -10px;
}

.mt-m-11 {
  margin-top: -11px;
}

.mt-m-12 {
  margin-top: -12px;
}

.mt-m-13 {
  margin-top: -13px;
}

.mt-m-14 {
  margin-top: -14px;
}

.mt-m-15 {
  margin-top: -15px;
}

.mt-m-16 {
  margin-top: -16px;
}

.mt-m-17 {
  margin-top: -17px;
}

.mt-m-18 {
  margin-top: -18px;
}

.mt-m-19 {
  margin-top: -19px;
}

.mt-m-20 {
  margin-top: -20px;
}

.mt-m-21 {
  margin-top: -21px;
}

.mt-m-22 {
  margin-top: -22px;
}

.mt-m-23 {
  margin-top: -23px;
}

.mt-m-24 {
  margin-top: -24px;
}

.mt-m-25 {
  margin-top: -25px;
}

.mt-m-26 {
  margin-top: -26px;
}

.mt-m-27 {
  margin-top: -27px;
}

.mt-m-28 {
  margin-top: -28px;
}

.mt-m-29 {
  margin-top: -29px;
}

.mt-m-30 {
  margin-top: -30px;
}

.mt-m-31 {
  margin-top: -31px;
}

.mt-m-32 {
  margin-top: -32px;
}

.mt-m-33 {
  margin-top: -33px;
}

.mt-m-34 {
  margin-top: -34px;
}

.mt-m-35 {
  margin-top: -35px;
}

.mt-m-36 {
  margin-top: -36px;
}

.mt-m-37 {
  margin-top: -37px;
}

.mt-m-38 {
  margin-top: -38px;
}

.mt-m-39 {
  margin-top: -39px;
}

.mt-m-40 {
  margin-top: -40px;
}

.mt-m-41 {
  margin-top: -41px;
}

.mt-m-42 {
  margin-top: -42px;
}

.mt-m-43 {
  margin-top: -43px;
}

.mt-m-44 {
  margin-top: -44px;
}

.mt-m-45 {
  margin-top: -45px;
}

.mt-m-46 {
  margin-top: -46px;
}

.mt-m-47 {
  margin-top: -47px;
}

.mt-m-48 {
  margin-top: -48px;
}

.mt-m-49 {
  margin-top: -49px;
}

.mt-m-50 {
  margin-top: -50px;
}

.mt-m-51 {
  margin-top: -51px;
}

.mt-m-52 {
  margin-top: -52px;
}

.mt-m-53 {
  margin-top: -53px;
}

.mt-m-54 {
  margin-top: -54px;
}

.mt-m-55 {
  margin-top: -55px;
}

.mt-m-56 {
  margin-top: -56px;
}

.mt-m-57 {
  margin-top: -57px;
}

.mt-m-58 {
  margin-top: -58px;
}

.mt-m-59 {
  margin-top: -59px;
}

.mt-m-60 {
  margin-top: -60px;
}

.mt-m-61 {
  margin-top: -61px;
}

.mt-m-62 {
  margin-top: -62px;
}

.mt-m-63 {
  margin-top: -63px;
}

.mt-m-64 {
  margin-top: -64px;
}

.mt-m-65 {
  margin-top: -65px;
}

.mt-m-66 {
  margin-top: -66px;
}

.mt-m-67 {
  margin-top: -67px;
}

.mt-m-68 {
  margin-top: -68px;
}

.mt-m-69 {
  margin-top: -69px;
}

.mt-m-70 {
  margin-top: -70px;
}

.mt-m-71 {
  margin-top: -71px;
}

.mt-m-72 {
  margin-top: -72px;
}

.mt-m-73 {
  margin-top: -73px;
}

.mt-m-74 {
  margin-top: -74px;
}

.mt-m-75 {
  margin-top: -75px;
}

.mb-m-0 {
  margin-bottom: -0px;
}

.mb-m-1 {
  margin-bottom: -1px;
}

.mb-m-2 {
  margin-bottom: -2px;
}

.mb-m-3 {
  margin-bottom: -3px;
}

.mb-m-4 {
  margin-bottom: -4px;
}

.mb-m-5 {
  margin-bottom: -5px;
}

.mb-m-6 {
  margin-bottom: -6px;
}

.mb-m-7 {
  margin-bottom: -7px;
}

.mb-m-8 {
  margin-bottom: -8px;
}

.mb-m-9 {
  margin-bottom: -9px;
}

.mb-m-10 {
  margin-bottom: -10px;
}

.mb-m-11 {
  margin-bottom: -11px;
}

.mb-m-12 {
  margin-bottom: -12px;
}

.mb-m-13 {
  margin-bottom: -13px;
}

.mb-m-14 {
  margin-bottom: -14px;
}

.mb-m-15 {
  margin-bottom: -15px;
}

.mb-m-16 {
  margin-bottom: -16px;
}

.mb-m-17 {
  margin-bottom: -17px;
}

.mb-m-18 {
  margin-bottom: -18px;
}

.mb-m-19 {
  margin-bottom: -19px;
}

.mb-m-20 {
  margin-bottom: -20px;
}

.mb-m-21 {
  margin-bottom: -21px;
}

.mb-m-22 {
  margin-bottom: -22px;
}

.mb-m-23 {
  margin-bottom: -23px;
}

.mb-m-24 {
  margin-bottom: -24px;
}

.mb-m-25 {
  margin-bottom: -25px;
}

.mb-m-26 {
  margin-bottom: -26px;
}

.mb-m-27 {
  margin-bottom: -27px;
}

.mb-m-28 {
  margin-bottom: -28px;
}

.mb-m-29 {
  margin-bottom: -29px;
}

.mb-m-30 {
  margin-bottom: -30px;
}

.mb-m-31 {
  margin-bottom: -31px;
}

.mb-m-32 {
  margin-bottom: -32px;
}

.mb-m-33 {
  margin-bottom: -33px;
}

.mb-m-34 {
  margin-bottom: -34px;
}

.mb-m-35 {
  margin-bottom: -35px;
}

.mb-m-36 {
  margin-bottom: -36px;
}

.mb-m-37 {
  margin-bottom: -37px;
}

.mb-m-38 {
  margin-bottom: -38px;
}

.mb-m-39 {
  margin-bottom: -39px;
}

.mb-m-40 {
  margin-bottom: -40px;
}

.mb-m-41 {
  margin-bottom: -41px;
}

.mb-m-42 {
  margin-bottom: -42px;
}

.mb-m-43 {
  margin-bottom: -43px;
}

.mb-m-44 {
  margin-bottom: -44px;
}

.mb-m-45 {
  margin-bottom: -45px;
}

.mb-m-46 {
  margin-bottom: -46px;
}

.mb-m-47 {
  margin-bottom: -47px;
}

.mb-m-48 {
  margin-bottom: -48px;
}

.mb-m-49 {
  margin-bottom: -49px;
}

.mb-m-50 {
  margin-bottom: -50px;
}

.mb-m-51 {
  margin-bottom: -51px;
}

.mb-m-52 {
  margin-bottom: -52px;
}

.mb-m-53 {
  margin-bottom: -53px;
}

.mb-m-54 {
  margin-bottom: -54px;
}

.mb-m-55 {
  margin-bottom: -55px;
}

.mb-m-56 {
  margin-bottom: -56px;
}

.mb-m-57 {
  margin-bottom: -57px;
}

.mb-m-58 {
  margin-bottom: -58px;
}

.mb-m-59 {
  margin-bottom: -59px;
}

.mb-m-60 {
  margin-bottom: -60px;
}

.mb-m-61 {
  margin-bottom: -61px;
}

.mb-m-62 {
  margin-bottom: -62px;
}

.mb-m-63 {
  margin-bottom: -63px;
}

.mb-m-64 {
  margin-bottom: -64px;
}

.mb-m-65 {
  margin-bottom: -65px;
}

.mb-m-66 {
  margin-bottom: -66px;
}

.mb-m-67 {
  margin-bottom: -67px;
}

.mb-m-68 {
  margin-bottom: -68px;
}

.mb-m-69 {
  margin-bottom: -69px;
}

.mb-m-70 {
  margin-bottom: -70px;
}

.mb-m-71 {
  margin-bottom: -71px;
}

.mb-m-72 {
  margin-bottom: -72px;
}

.mb-m-73 {
  margin-bottom: -73px;
}

.mb-m-74 {
  margin-bottom: -74px;
}

.mb-m-75 {
  margin-bottom: -75px;
}

.ml-m-0 {
  margin-left: -0px;
}

.ml-m-1 {
  margin-left: -1px;
}

.ml-m-2 {
  margin-left: -2px;
}

.ml-m-3 {
  margin-left: -3px;
}

.ml-m-4 {
  margin-left: -4px;
}

.ml-m-5 {
  margin-left: -5px;
}

.ml-m-6 {
  margin-left: -6px;
}

.ml-m-7 {
  margin-left: -7px;
}

.ml-m-8 {
  margin-left: -8px;
}

.ml-m-9 {
  margin-left: -9px;
}

.ml-m-10 {
  margin-left: -10px;
}

.ml-m-11 {
  margin-left: -11px;
}

.ml-m-12 {
  margin-left: -12px;
}

.ml-m-13 {
  margin-left: -13px;
}

.ml-m-14 {
  margin-left: -14px;
}

.ml-m-15 {
  margin-left: -15px;
}

.ml-m-16 {
  margin-left: -16px;
}

.ml-m-17 {
  margin-left: -17px;
}

.ml-m-18 {
  margin-left: -18px;
}

.ml-m-19 {
  margin-left: -19px;
}

.ml-m-20 {
  margin-left: -20px;
}

.ml-m-21 {
  margin-left: -21px;
}

.ml-m-22 {
  margin-left: -22px;
}

.ml-m-23 {
  margin-left: -23px;
}

.ml-m-24 {
  margin-left: -24px;
}

.ml-m-25 {
  margin-left: -25px;
}

.ml-m-26 {
  margin-left: -26px;
}

.ml-m-27 {
  margin-left: -27px;
}

.ml-m-28 {
  margin-left: -28px;
}

.ml-m-29 {
  margin-left: -29px;
}

.ml-m-30 {
  margin-left: -30px;
}

.ml-m-31 {
  margin-left: -31px;
}

.ml-m-32 {
  margin-left: -32px;
}

.ml-m-33 {
  margin-left: -33px;
}

.ml-m-34 {
  margin-left: -34px;
}

.ml-m-35 {
  margin-left: -35px;
}

.ml-m-36 {
  margin-left: -36px;
}

.ml-m-37 {
  margin-left: -37px;
}

.ml-m-38 {
  margin-left: -38px;
}

.ml-m-39 {
  margin-left: -39px;
}

.ml-m-40 {
  margin-left: -40px;
}

.ml-m-41 {
  margin-left: -41px;
}

.ml-m-42 {
  margin-left: -42px;
}

.ml-m-43 {
  margin-left: -43px;
}

.ml-m-44 {
  margin-left: -44px;
}

.ml-m-45 {
  margin-left: -45px;
}

.ml-m-46 {
  margin-left: -46px;
}

.ml-m-47 {
  margin-left: -47px;
}

.ml-m-48 {
  margin-left: -48px;
}

.ml-m-49 {
  margin-left: -49px;
}

.ml-m-50 {
  margin-left: -50px;
}

.ml-m-51 {
  margin-left: -51px;
}

.ml-m-52 {
  margin-left: -52px;
}

.ml-m-53 {
  margin-left: -53px;
}

.ml-m-54 {
  margin-left: -54px;
}

.ml-m-55 {
  margin-left: -55px;
}

.ml-m-56 {
  margin-left: -56px;
}

.ml-m-57 {
  margin-left: -57px;
}

.ml-m-58 {
  margin-left: -58px;
}

.ml-m-59 {
  margin-left: -59px;
}

.ml-m-60 {
  margin-left: -60px;
}

.ml-m-61 {
  margin-left: -61px;
}

.ml-m-62 {
  margin-left: -62px;
}

.ml-m-63 {
  margin-left: -63px;
}

.ml-m-64 {
  margin-left: -64px;
}

.ml-m-65 {
  margin-left: -65px;
}

.ml-m-66 {
  margin-left: -66px;
}

.ml-m-67 {
  margin-left: -67px;
}

.ml-m-68 {
  margin-left: -68px;
}

.ml-m-69 {
  margin-left: -69px;
}

.ml-m-70 {
  margin-left: -70px;
}

.ml-m-71 {
  margin-left: -71px;
}

.ml-m-72 {
  margin-left: -72px;
}

.ml-m-73 {
  margin-left: -73px;
}

.ml-m-74 {
  margin-left: -74px;
}

.ml-m-75 {
  margin-left: -75px;
}

.mr-m-0 {
  margin-right: -0px;
}

.mr-m-1 {
  margin-right: -1px;
}

.mr-m-2 {
  margin-right: -2px;
}

.mr-m-3 {
  margin-right: -3px;
}

.mr-m-4 {
  margin-right: -4px;
}

.mr-m-5 {
  margin-right: -5px;
}

.mr-m-6 {
  margin-right: -6px;
}

.mr-m-7 {
  margin-right: -7px;
}

.mr-m-8 {
  margin-right: -8px;
}

.mr-m-9 {
  margin-right: -9px;
}

.mr-m-10 {
  margin-right: -10px;
}

.mr-m-11 {
  margin-right: -11px;
}

.mr-m-12 {
  margin-right: -12px;
}

.mr-m-13 {
  margin-right: -13px;
}

.mr-m-14 {
  margin-right: -14px;
}

.mr-m-15 {
  margin-right: -15px;
}

.mr-m-16 {
  margin-right: -16px;
}

.mr-m-17 {
  margin-right: -17px;
}

.mr-m-18 {
  margin-right: -18px;
}

.mr-m-19 {
  margin-right: -19px;
}

.mr-m-20 {
  margin-right: -20px;
}

.mr-m-21 {
  margin-right: -21px;
}

.mr-m-22 {
  margin-right: -22px;
}

.mr-m-23 {
  margin-right: -23px;
}

.mr-m-24 {
  margin-right: -24px;
}

.mr-m-25 {
  margin-right: -25px;
}

.mr-m-26 {
  margin-right: -26px;
}

.mr-m-27 {
  margin-right: -27px;
}

.mr-m-28 {
  margin-right: -28px;
}

.mr-m-29 {
  margin-right: -29px;
}

.mr-m-30 {
  margin-right: -30px;
}

.mr-m-31 {
  margin-right: -31px;
}

.mr-m-32 {
  margin-right: -32px;
}

.mr-m-33 {
  margin-right: -33px;
}

.mr-m-34 {
  margin-right: -34px;
}

.mr-m-35 {
  margin-right: -35px;
}

.mr-m-36 {
  margin-right: -36px;
}

.mr-m-37 {
  margin-right: -37px;
}

.mr-m-38 {
  margin-right: -38px;
}

.mr-m-39 {
  margin-right: -39px;
}

.mr-m-40 {
  margin-right: -40px;
}

.mr-m-41 {
  margin-right: -41px;
}

.mr-m-42 {
  margin-right: -42px;
}

.mr-m-43 {
  margin-right: -43px;
}

.mr-m-44 {
  margin-right: -44px;
}

.mr-m-45 {
  margin-right: -45px;
}

.mr-m-46 {
  margin-right: -46px;
}

.mr-m-47 {
  margin-right: -47px;
}

.mr-m-48 {
  margin-right: -48px;
}

.mr-m-49 {
  margin-right: -49px;
}

.mr-m-50 {
  margin-right: -50px;
}

.mr-m-51 {
  margin-right: -51px;
}

.mr-m-52 {
  margin-right: -52px;
}

.mr-m-53 {
  margin-right: -53px;
}

.mr-m-54 {
  margin-right: -54px;
}

.mr-m-55 {
  margin-right: -55px;
}

.mr-m-56 {
  margin-right: -56px;
}

.mr-m-57 {
  margin-right: -57px;
}

.mr-m-58 {
  margin-right: -58px;
}

.mr-m-59 {
  margin-right: -59px;
}

.mr-m-60 {
  margin-right: -60px;
}

.mr-m-61 {
  margin-right: -61px;
}

.mr-m-62 {
  margin-right: -62px;
}

.mr-m-63 {
  margin-right: -63px;
}

.mr-m-64 {
  margin-right: -64px;
}

.mr-m-65 {
  margin-right: -65px;
}

.mr-m-66 {
  margin-right: -66px;
}

.mr-m-67 {
  margin-right: -67px;
}

.mr-m-68 {
  margin-right: -68px;
}

.mr-m-69 {
  margin-right: -69px;
}

.mr-m-70 {
  margin-right: -70px;
}

.mr-m-71 {
  margin-right: -71px;
}

.mr-m-72 {
  margin-right: -72px;
}

.mr-m-73 {
  margin-right: -73px;
}

.mr-m-74 {
  margin-right: -74px;
}

.mr-m-75 {
  margin-right: -75px;
}

.text-s-0 {
  font-size: 0px;
}

.text-s-1 {
  font-size: 1px;
}

.text-s-2 {
  font-size: 2px;
}

.text-s-3 {
  font-size: 3px;
}

.text-s-4 {
  font-size: 4px;
}

.text-s-5 {
  font-size: 5px;
}

.text-s-6 {
  font-size: 6px;
}

.text-s-7 {
  font-size: 7px;
}

.text-s-8 {
  font-size: 8px;
}

.text-s-9 {
  font-size: 9px;
}

.text-s-10 {
  font-size: 10px;
}

.text-s-11 {
  font-size: 11px;
}

.text-s-12 {
  font-size: 12px;
}

.text-s-13 {
  font-size: 13px;
}

.text-s-14 {
  font-size: 14px;
}

.text-s-15 {
  font-size: 15px;
}

.text-s-16 {
  font-size: 16px;
}

.text-s-17 {
  font-size: 17px;
}

.text-s-18 {
  font-size: 18px;
}

.text-s-19 {
  font-size: 19px;
}

.text-s-20 {
  font-size: 20px;
}

.text-s-21 {
  font-size: 21px;
}

.text-s-22 {
  font-size: 22px;
}

.text-s-23 {
  font-size: 23px;
}

.text-s-24 {
  font-size: 24px;
}

.text-s-25 {
  font-size: 25px;
}

.text-s-26 {
  font-size: 26px;
}

.text-s-27 {
  font-size: 27px;
}

.text-s-28 {
  font-size: 28px;
}

.text-s-29 {
  font-size: 29px;
}

.text-s-30 {
  font-size: 30px;
}

.text-s-31 {
  font-size: 31px;
}

.text-s-32 {
  font-size: 32px;
}

.text-s-33 {
  font-size: 33px;
}

.text-s-34 {
  font-size: 34px;
}

.text-s-35 {
  font-size: 35px;
}

.text-s-36 {
  font-size: 36px;
}

.text-s-37 {
  font-size: 37px;
}

.text-s-38 {
  font-size: 38px;
}

.text-s-39 {
  font-size: 39px;
}

.text-s-40 {
  font-size: 40px;
}

.text-s-41 {
  font-size: 41px;
}

.text-s-42 {
  font-size: 42px;
}

.text-s-43 {
  font-size: 43px;
}

.text-s-44 {
  font-size: 44px;
}

.text-s-45 {
  font-size: 45px;
}

.text-s-46 {
  font-size: 46px;
}

.text-s-47 {
  font-size: 47px;
}

.text-s-48 {
  font-size: 48px;
}

.text-s-49 {
  font-size: 49px;
}

.text-s-50 {
  font-size: 50px;
}

.text-s-51 {
  font-size: 51px;
}

.text-s-52 {
  font-size: 52px;
}

.text-s-53 {
  font-size: 53px;
}

.text-s-54 {
  font-size: 54px;
}

.text-s-55 {
  font-size: 55px;
}

.text-s-56 {
  font-size: 56px;
}

.text-s-57 {
  font-size: 57px;
}

.text-s-58 {
  font-size: 58px;
}

.text-s-59 {
  font-size: 59px;
}

.text-s-60 {
  font-size: 60px;
}

.text-s-61 {
  font-size: 61px;
}

.text-s-62 {
  font-size: 62px;
}

.text-s-63 {
  font-size: 63px;
}

.text-s-64 {
  font-size: 64px;
}

.text-s-65 {
  font-size: 65px;
}

.text-s-66 {
  font-size: 66px;
}

.text-s-67 {
  font-size: 67px;
}

.text-s-68 {
  font-size: 68px;
}

.text-s-69 {
  font-size: 69px;
}

.text-s-70 {
  font-size: 70px;
}

.text-s-71 {
  font-size: 71px;
}

.text-s-72 {
  font-size: 72px;
}

.text-s-73 {
  font-size: 73px;
}

.text-s-74 {
  font-size: 74px;
}

.text-s-75 {
  font-size: 75px;
}

.col-center {
  float: none;
  margin: 0 auto;
}

.row-flex {
  display: flex;
  flex-wrap: wrap;
}

.row-flex [class*="col-xs-1"] {
  flex: 1 0 8.33333%;
}

.row-flex [class*="col-xs-1"]:last-child {
  flex: 0 0 8.33333%;
}

.row-flex [class*="col-xs-2"] {
  flex: 2 0 16.66667%;
}

.row-flex [class*="col-xs-2"]:last-child {
  flex: 0 0 16.66667%;
}

.row-flex [class*="col-xs-3"] {
  flex: 3 0 25%;
}

.row-flex [class*="col-xs-3"]:last-child {
  flex: 0 0 25%;
}

.row-flex [class*="col-xs-4"] {
  flex: 4 0 33.33333%;
}

.row-flex [class*="col-xs-4"]:last-child {
  flex: 0 0 33.33333%;
}

.row-flex [class*="col-xs-5"] {
  flex: 5 0 41.66667%;
}

.row-flex [class*="col-xs-5"]:last-child {
  flex: 0 0 41.66667%;
}

.row-flex [class*="col-xs-6"] {
  flex: 6 0 50%;
}

.row-flex [class*="col-xs-6"]:last-child {
  flex: 0 0 50%;
}

.row-flex [class*="col-xs-7"] {
  flex: 7 0 58.33333%;
}

.row-flex [class*="col-xs-7"]:last-child {
  flex: 0 0 58.33333%;
}

.row-flex [class*="col-xs-8"] {
  flex: 8 0 66.66667%;
}

.row-flex [class*="col-xs-8"]:last-child {
  flex: 0 0 66.66667%;
}

.row-flex [class*="col-xs-9"] {
  flex: 9 0 75%;
}

.row-flex [class*="col-xs-9"]:last-child {
  flex: 0 0 75%;
}

.row-flex [class*="col-xs-10"] {
  flex: 10 0 83.33333%;
}

.row-flex [class*="col-xs-10"]:last-child {
  flex: 0 0 83.33333%;
}

.row-flex [class*="col-xs-11"] {
  flex: 11 0 91.66667%;
}

.row-flex [class*="col-xs-11"]:last-child {
  flex: 0 0 91.66667%;
}

.row-flex [class*="col-xs-12"] {
  flex: 12 0 100%;
}

.row-flex [class*="col-xs-12"]:last-child {
  flex: 0 0 100%;
}

@media (min-width: 768px) {
  .row-flex [class*="col-sm-1"] {
    flex: 1 0 8.33333%;
  }
  
  .row-flex [class*="col-sm-1"]:last-child {
    flex: 0 0 8.33333%;
  }
  
  .row-flex [class*="col-sm-2"] {
    flex: 2 0 16.66667%;
  }
  
  .row-flex [class*="col-sm-2"]:last-child {
    flex: 0 0 16.66667%;
  }
  
  .row-flex [class*="col-sm-3"] {
    flex: 3 0 25%;
  }
  
  .row-flex [class*="col-sm-3"]:last-child {
    flex: 0 0 25%;
  }
  
  .row-flex [class*="col-sm-4"] {
    flex: 4 0 33.33333%;
  }
  
  .row-flex [class*="col-sm-4"]:last-child {
    flex: 0 0 33.33333%;
  }
  
  .row-flex [class*="col-sm-5"] {
    flex: 5 0 41.66667%;
  }
  
  .row-flex [class*="col-sm-5"]:last-child {
    flex: 0 0 41.66667%;
  }
  
  .row-flex [class*="col-sm-6"] {
    flex: 6 0 50%;
  }
  
  .row-flex [class*="col-sm-6"]:last-child {
    flex: 0 0 50%;
  }
  
  .row-flex [class*="col-sm-7"] {
    flex: 7 0 58.33333%;
  }
  
  .row-flex [class*="col-sm-7"]:last-child {
    flex: 0 0 58.33333%;
  }
  
  .row-flex [class*="col-sm-8"] {
    flex: 8 0 66.66667%;
  }
  
  .row-flex [class*="col-sm-8"]:last-child {
    flex: 0 0 66.66667%;
  }
  
  .row-flex [class*="col-sm-9"] {
    flex: 9 0 75%;
  }
  
  .row-flex [class*="col-sm-9"]:last-child {
    flex: 0 0 75%;
  }
  
  .row-flex [class*="col-sm-10"] {
    flex: 10 0 83.33333%;
  }
  
  .row-flex [class*="col-sm-10"]:last-child {
    flex: 0 0 83.33333%;
  }
  
  .row-flex [class*="col-sm-11"] {
    flex: 11 0 91.66667%;
  }
  
  .row-flex [class*="col-sm-11"]:last-child {
    flex: 0 0 91.66667%;
  }
  
  .row-flex [class*="col-sm-12"] {
    flex: 12 0 100%;
  }
  
  .row-flex [class*="col-sm-12"]:last-child {
    flex: 0 0 100%;
  }
}

@media (min-width: 992px) {
  .row-flex [class*="col-md-1"] {
    flex: 1 0 8.33333%;
  }
  
  .row-flex [class*="col-md-1"]:last-child {
    flex: 0 0 8.33333%;
  }
  
  .row-flex [class*="col-md-2"] {
    flex: 2 0 16.66667%;
  }
  
  .row-flex [class*="col-md-2"]:last-child {
    flex: 0 0 16.66667%;
  }
  
  .row-flex [class*="col-md-3"] {
    flex: 3 0 25%;
  }
  
  .row-flex [class*="col-md-3"]:last-child {
    flex: 0 0 25%;
  }
  
  .row-flex [class*="col-md-4"] {
    flex: 4 0 33.33333%;
  }
  
  .row-flex [class*="col-md-4"]:last-child {
    flex: 0 0 33.33333%;
  }
  
  .row-flex [class*="col-md-5"] {
    flex: 5 0 41.66667%;
  }
  
  .row-flex [class*="col-md-5"]:last-child {
    flex: 0 0 41.66667%;
  }
  
  .row-flex [class*="col-md-6"] {
    flex: 6 0 50%;
  }
  
  .row-flex [class*="col-md-6"]:last-child {
    flex: 0 0 50%;
  }
  
  .row-flex [class*="col-md-7"] {
    flex: 7 0 58.33333%;
  }
  
  .row-flex [class*="col-md-7"]:last-child {
    flex: 0 0 58.33333%;
  }
  
  .row-flex [class*="col-md-8"] {
    flex: 8 0 66.66667%;
  }
  
  .row-flex [class*="col-md-8"]:last-child {
    flex: 0 0 66.66667%;
  }
  
  .row-flex [class*="col-md-9"] {
    flex: 9 0 75%;
  }
  
  .row-flex [class*="col-md-9"]:last-child {
    flex: 0 0 75%;
  }
  
  .row-flex [class*="col-md-10"] {
    flex: 10 0 83.33333%;
  }
  
  .row-flex [class*="col-md-10"]:last-child {
    flex: 0 0 83.33333%;
  }
  
  .row-flex [class*="col-md-11"] {
    flex: 11 0 91.66667%;
  }
  
  .row-flex [class*="col-md-11"]:last-child {
    flex: 0 0 91.66667%;
  }
  
  .row-flex [class*="col-md-12"] {
    flex: 12 0 100%;
  }
  
  .row-flex [class*="col-md-12"]:last-child {
    flex: 0 0 100%;
  }
}

@media (min-width: 1200px) {
  .row-flex [class*="col-lg-1"] {
    flex: 1 0 8.33333%;
  }
  
  .row-flex [class*="col-lg-1"]:last-child {
    flex: 0 0 8.33333%;
  }
  
  .row-flex [class*="col-lg-2"] {
    flex: 2 0 16.66667%;
  }
  
  .row-flex [class*="col-lg-2"]:last-child {
    flex: 0 0 16.66667%;
  }
  
  .row-flex [class*="col-lg-3"] {
    flex: 3 0 25%;
  }
  
  .row-flex [class*="col-lg-3"]:last-child {
    flex: 0 0 25%;
  }
  
  .row-flex [class*="col-lg-4"] {
    flex: 4 0 33.33333%;
  }
  
  .row-flex [class*="col-lg-4"]:last-child {
    flex: 0 0 33.33333%;
  }
  
  .row-flex [class*="col-lg-5"] {
    flex: 5 0 41.66667%;
  }
  
  .row-flex [class*="col-lg-5"]:last-child {
    flex: 0 0 41.66667%;
  }
  
  .row-flex [class*="col-lg-6"] {
    flex: 6 0 50%;
  }
  
  .row-flex [class*="col-lg-6"]:last-child {
    flex: 0 0 50%;
  }
  
  .row-flex [class*="col-lg-7"] {
    flex: 7 0 58.33333%;
  }
  
  .row-flex [class*="col-lg-7"]:last-child {
    flex: 0 0 58.33333%;
  }
  
  .row-flex [class*="col-lg-8"] {
    flex: 8 0 66.66667%;
  }
  
  .row-flex [class*="col-lg-8"]:last-child {
    flex: 0 0 66.66667%;
  }
  
  .row-flex [class*="col-lg-9"] {
    flex: 9 0 75%;
  }
  
  .row-flex [class*="col-lg-9"]:last-child {
    flex: 0 0 75%;
  }
  
  .row-flex [class*="col-lg-10"] {
    flex: 10 0 83.33333%;
  }
  
  .row-flex [class*="col-lg-10"]:last-child {
    flex: 0 0 83.33333%;
  }
  
  .row-flex [class*="col-lg-11"] {
    flex: 11 0 91.66667%;
  }
  
  .row-flex [class*="col-lg-11"]:last-child {
    flex: 0 0 91.66667%;
  }
  
  .row-flex [class*="col-lg-12"] {
    flex: 12 0 100%;
  }
  
  .row-flex [class*="col-lg-12"]:last-child {
    flex: 0 0 100%;
  }
}

.text-dark {
  color: black;
}

.text-white-shadow {
  text-shadow: 1px 1px #dbf7ff;
}

.text-ligth {
  font-weight: lighter;
}

.text-bold {
  font-weight: bold;
}

.text-heavy {
  font-weight: heavy;
}

.cat-dsh-selector {
  border-radius: 16px;
  padding: 4px 5px;
  line-height: 12px;
  outline: 0;
}

.cat-dsh-title {
  margin-top: 0px;
  font-weight: bold;
}

.d-content {
  display: contents;
}

.d-inline {
  display: inline;
}

@media print {
  .no-print, .no-print * {
    display: none !important;
  }
}

.w-0 {
  width: 0%
}

.h-0 {
  height: 0%
}

.w-1 {
  width: 1%
}

.h-1 {
  height: 1%
}

.w-2 {
  width: 2%
}

.h-2 {
  height: 2%
}

.w-3 {
  width: 3%
}

.h-3 {
  height: 3%
}

.w-4 {
  width: 4%
}

.h-4 {
  height: 4%
}

.w-5 {
  width: 5%
}

.h-5 {
  height: 5%
}

.w-6 {
  width: 6%
}

.h-6 {
  height: 6%
}

.w-7 {
  width: 7%
}

.h-7 {
  height: 7%
}

.w-8 {
  width: 8%
}

.h-8 {
  height: 8%
}

.w-9 {
  width: 9%
}

.h-9 {
  height: 9%
}

.w-10 {
  width: 10%
}

.h-10 {
  height: 10%
}

.w-11 {
  width: 11%
}

.h-11 {
  height: 11%
}

.w-12 {
  width: 12%
}

.h-12 {
  height: 12%
}

.w-13 {
  width: 13%
}

.h-13 {
  height: 13%
}

.w-14 {
  width: 14%
}

.h-14 {
  height: 14%
}

.w-15 {
  width: 15%
}

.h-15 {
  height: 15%
}

.w-16 {
  width: 16%
}

.h-16 {
  height: 16%
}

.w-17 {
  width: 17%
}

.h-17 {
  height: 17%
}

.w-18 {
  width: 18%
}

.h-18 {
  height: 18%
}

.w-19 {
  width: 19%
}

.h-19 {
  height: 19%
}

.w-20 {
  width: 20%
}

.h-20 {
  height: 20%
}

.w-21 {
  width: 21%
}

.h-21 {
  height: 21%
}

.w-22 {
  width: 22%
}

.h-22 {
  height: 22%
}

.w-23 {
  width: 23%
}

.h-23 {
  height: 23%
}

.w-24 {
  width: 24%
}

.h-24 {
  height: 24%
}

.w-25 {
  width: 25%
}

.h-25 {
  height: 25%
}

.w-26 {
  width: 26%
}

.h-26 {
  height: 26%
}

.w-27 {
  width: 27%
}

.h-27 {
  height: 27%
}

.w-28 {
  width: 28%
}

.h-28 {
  height: 28%
}

.w-29 {
  width: 29%
}

.h-29 {
  height: 29%
}

.w-30 {
  width: 30%
}

.h-30 {
  height: 30%
}

.w-31 {
  width: 31%
}

.h-31 {
  height: 31%
}

.w-32 {
  width: 32%
}

.h-32 {
  height: 32%
}

.w-33 {
  width: 33%
}

.h-33 {
  height: 33%
}

.w-34 {
  width: 34%
}

.h-34 {
  height: 34%
}

.w-35 {
  width: 35%
}

.h-35 {
  height: 35%
}

.w-36 {
  width: 36%
}

.h-36 {
  height: 36%
}

.w-37 {
  width: 37%
}

.h-37 {
  height: 37%
}

.w-38 {
  width: 38%
}

.h-38 {
  height: 38%
}

.w-39 {
  width: 39%
}

.h-39 {
  height: 39%
}

.w-40 {
  width: 40%
}

.h-40 {
  height: 40%
}

.w-41 {
  width: 41%
}

.h-41 {
  height: 41%
}

.w-42 {
  width: 42%
}

.h-42 {
  height: 42%
}

.w-43 {
  width: 43%
}

.h-43 {
  height: 43%
}

.w-44 {
  width: 44%
}

.h-44 {
  height: 44%
}

.w-45 {
  width: 45%
}

.h-45 {
  height: 45%
}

.w-46 {
  width: 46%
}

.h-46 {
  height: 46%
}

.w-47 {
  width: 47%
}

.h-47 {
  height: 47%
}

.w-48 {
  width: 48%
}

.h-48 {
  height: 48%
}

.w-49 {
  width: 49%
}

.h-49 {
  height: 49%
}

.w-50 {
  width: 50%
}

.h-50 {
  height: 50%
}

.w-51 {
  width: 51%
}

.h-51 {
  height: 51%
}

.w-52 {
  width: 52%
}

.h-52 {
  height: 52%
}

.w-53 {
  width: 53%
}

.h-53 {
  height: 53%
}

.w-54 {
  width: 54%
}

.h-54 {
  height: 54%
}

.w-55 {
  width: 55%
}

.h-55 {
  height: 55%
}

.w-56 {
  width: 56%
}

.h-56 {
  height: 56%
}

.w-57 {
  width: 57%
}

.h-57 {
  height: 57%
}

.w-58 {
  width: 58%
}

.h-58 {
  height: 58%
}

.w-59 {
  width: 59%
}

.h-59 {
  height: 59%
}

.w-60 {
  width: 60%
}

.h-60 {
  height: 60%
}

.w-61 {
  width: 61%
}

.h-61 {
  height: 61%
}

.w-62 {
  width: 62%
}

.h-62 {
  height: 62%
}

.w-63 {
  width: 63%
}

.h-63 {
  height: 63%
}

.w-64 {
  width: 64%
}

.h-64 {
  height: 64%
}

.w-65 {
  width: 65%
}

.h-65 {
  height: 65%
}

.w-66 {
  width: 66%
}

.h-66 {
  height: 66%
}

.w-67 {
  width: 67%
}

.h-67 {
  height: 67%
}

.w-68 {
  width: 68%
}

.h-68 {
  height: 68%
}

.w-69 {
  width: 69%
}

.h-69 {
  height: 69%
}

.w-70 {
  width: 70%
}

.h-70 {
  height: 70%
}

.w-71 {
  width: 71%
}

.h-71 {
  height: 71%
}

.w-72 {
  width: 72%
}

.h-72 {
  height: 72%
}

.w-73 {
  width: 73%
}

.h-73 {
  height: 73%
}

.w-74 {
  width: 74%
}

.h-74 {
  height: 74%
}

.w-75 {
  width: 75%
}

.h-75 {
  height: 75%
}

.w-76 {
  width: 76%
}

.h-76 {
  height: 76%
}

.w-77 {
  width: 77%
}

.h-77 {
  height: 77%
}

.w-78 {
  width: 78%
}

.h-78 {
  height: 78%
}

.w-79 {
  width: 79%
}

.h-79 {
  height: 79%
}

.w-80 {
  width: 80%
}

.h-80 {
  height: 80%
}

.w-81 {
  width: 81%
}

.h-81 {
  height: 81%
}

.w-82 {
  width: 82%
}

.h-82 {
  height: 82%
}

.w-83 {
  width: 83%
}

.h-83 {
  height: 83%
}

.w-84 {
  width: 84%
}

.h-84 {
  height: 84%
}

.w-85 {
  width: 85%
}

.h-85 {
  height: 85%
}

.w-86 {
  width: 86%
}

.h-86 {
  height: 86%
}

.w-87 {
  width: 87%
}

.h-87 {
  height: 87%
}

.w-88 {
  width: 88%
}

.h-88 {
  height: 88%
}

.w-89 {
  width: 89%
}

.h-89 {
  height: 89%
}

.w-90 {
  width: 90%
}

.h-90 {
  height: 90%
}

.w-91 {
  width: 91%
}

.h-91 {
  height: 91%
}

.w-92 {
  width: 92%
}

.h-92 {
  height: 92%
}

.w-93 {
  width: 93%
}

.h-93 {
  height: 93%
}

.w-94 {
  width: 94%
}

.h-94 {
  height: 94%
}

.w-95 {
  width: 95%
}

.h-95 {
  height: 95%
}

.w-96 {
  width: 96%
}

.h-96 {
  height: 96%
}

.w-97 {
  width: 97%
}

.h-97 {
  height: 97%
}

.w-98 {
  width: 98%
}

.h-98 {
  height: 98%
}

.w-99 {
  width: 99%
}

.h-99 {
  height: 99%
}

.w-100 {
  width: 100%;
}

.h-100 {
  height: 100%;
}

.mw-1 {
  min-width: 1px;
}

.mw-2 {
  min-width: 2px;
}

.mw-3 {
  min-width: 3px;
}

.mw-4 {
  min-width: 4px;
}

.mw-5 {
  min-width: 5px;
}

.mw-6 {
  min-width: 6px;
}

.mw-7 {
  min-width: 7px;
}

.mw-8 {
  min-width: 8px;
}

.mw-9 {
  min-width: 9px;
}

.mw-10 {
  min-width: 10px;
}

.mw-11 {
  min-width: 11px;
}

.mw-12 {
  min-width: 12px;
}

.mw-13 {
  min-width: 13px;
}

.mw-14 {
  min-width: 14px;
}

.mw-15 {
  min-width: 15px;
}

.mw-16 {
  min-width: 16px;
}

.mw-17 {
  min-width: 17px;
}

.mw-18 {
  min-width: 18px;
}

.mw-19 {
  min-width: 19px;
}

.mw-20 {
  min-width: 20px;
}

.mw-21 {
  min-width: 21px;
}

.mw-22 {
  min-width: 22px;
}

.mw-23 {
  min-width: 23px;
}

.mw-24 {
  min-width: 24px;
}

.mw-25 {
  min-width: 25px;
}

.mw-26 {
  min-width: 26px;
}

.mw-27 {
  min-width: 27px;
}

.mw-28 {
  min-width: 28px;
}

.mw-29 {
  min-width: 29px;
}

.mw-30 {
  min-width: 30px;
}

.mw-31 {
  min-width: 31px;
}

.mw-32 {
  min-width: 32px;
}

.mw-33 {
  min-width: 33px;
}

.mw-34 {
  min-width: 34px;
}

.mw-35 {
  min-width: 35px;
}

.mw-36 {
  min-width: 36px;
}

.mw-37 {
  min-width: 37px;
}

.mw-38 {
  min-width: 38px;
}

.mw-39 {
  min-width: 39px;
}

.mw-40 {
  min-width: 40px;
}

.mw-41 {
  min-width: 41px;
}

.mw-42 {
  min-width: 42px;
}

.mw-43 {
  min-width: 43px;
}

.mw-44 {
  min-width: 44px;
}

.mw-45 {
  min-width: 45px;
}

.mw-46 {
  min-width: 46px;
}

.mw-47 {
  min-width: 47px;
}

.mw-48 {
  min-width: 48px;
}

.mw-49 {
  min-width: 49px;
}

.mw-50 {
  min-width: 50px;
}

.mw-51 {
  min-width: 51px;
}

.mw-52 {
  min-width: 52px;
}

.mw-53 {
  min-width: 53px;
}

.mw-54 {
  min-width: 54px;
}

.mw-55 {
  min-width: 55px;
}

.mw-56 {
  min-width: 56px;
}

.mw-57 {
  min-width: 57px;
}

.mw-58 {
  min-width: 58px;
}

.mw-59 {
  min-width: 59px;
}

.mw-60 {
  min-width: 60px;
}

.mw-61 {
  min-width: 61px;
}

.mw-62 {
  min-width: 62px;
}

.mw-63 {
  min-width: 63px;
}

.mw-64 {
  min-width: 64px;
}

.mw-65 {
  min-width: 65px;
}

.mw-66 {
  min-width: 66px;
}

.mw-67 {
  min-width: 67px;
}

.mw-68 {
  min-width: 68px;
}

.mw-69 {
  min-width: 69px;
}

.mw-70 {
  min-width: 70px;
}

.mw-71 {
  min-width: 71px;
}

.mw-72 {
  min-width: 72px;
}

.mw-73 {
  min-width: 73px;
}

.mw-74 {
  min-width: 74px;
}

.mw-75 {
  min-width: 75px;
}

.mw-76 {
  min-width: 76px;
}

.mw-77 {
  min-width: 77px;
}

.mw-78 {
  min-width: 78px;
}

.mw-79 {
  min-width: 79px;
}

.mw-80 {
  min-width: 80px;
}

.mw-81 {
  min-width: 81px;
}

.mw-82 {
  min-width: 82px;
}

.mw-83 {
  min-width: 83px;
}

.mw-84 {
  min-width: 84px;
}

.mw-85 {
  min-width: 85px;
}

.mw-86 {
  min-width: 86px;
}

.mw-87 {
  min-width: 87px;
}

.mw-88 {
  min-width: 88px;
}

.mw-89 {
  min-width: 89px;
}

.mw-90 {
  min-width: 90px;
}

.mw-91 {
  min-width: 91px;
}

.mw-92 {
  min-width: 92px;
}

.mw-93 {
  min-width: 93px;
}

.mw-94 {
  min-width: 94px;
}

.mw-95 {
  min-width: 95px;
}

.mw-96 {
  min-width: 96px;
}

.mw-97 {
  min-width: 97px;
}

.mw-98 {
  min-width: 98px;
}

.mw-99 {
  min-width: 99px;
}

.mw-100 {
  min-width: 100px;
}

.mw-101 {
  min-width: 101px;
}

.mw-102 {
  min-width: 102px;
}

.mw-103 {
  min-width: 103px;
}

.mw-104 {
  min-width: 104px;
}

.mw-105 {
  min-width: 105px;
}

.mw-106 {
  min-width: 106px;
}

.mw-107 {
  min-width: 107px;
}

.mw-108 {
  min-width: 108px;
}

.mw-109 {
  min-width: 109px;
}

.mw-110 {
  min-width: 110px;
}

.mw-111 {
  min-width: 111px;
}

.mw-112 {
  min-width: 112px;
}

.mw-113 {
  min-width: 113px;
}

.mw-114 {
  min-width: 114px;
}

.mw-115 {
  min-width: 115px;
}

.mw-116 {
  min-width: 116px;
}

.mw-117 {
  min-width: 117px;
}

.mw-118 {
  min-width: 118px;
}

.mw-119 {
  min-width: 119px;
}

.mw-120 {
  min-width: 120px;
}

.mw-121 {
  min-width: 121px;
}

.mw-122 {
  min-width: 122px;
}

.mw-123 {
  min-width: 123px;
}

.mw-124 {
  min-width: 124px;
}

.mw-125 {
  min-width: 125px;
}

.mw-126 {
  min-width: 126px;
}

.mw-127 {
  min-width: 127px;
}

.mw-128 {
  min-width: 128px;
}

.mw-129 {
  min-width: 129px;
}

.mw-130 {
  min-width: 130px;
}

.mw-131 {
  min-width: 131px;
}

.mw-132 {
  min-width: 132px;
}

.mw-133 {
  min-width: 133px;
}

.mw-134 {
  min-width: 134px;
}

.mw-135 {
  min-width: 135px;
}

.mw-136 {
  min-width: 136px;
}

.mw-137 {
  min-width: 137px;
}

.mw-138 {
  min-width: 138px;
}

.mw-139 {
  min-width: 139px;
}

.mw-140 {
  min-width: 140px;
}

.mw-141 {
  min-width: 141px;
}

.mw-142 {
  min-width: 142px;
}

.mw-143 {
  min-width: 143px;
}

.mw-144 {
  min-width: 144px;
}

.mw-145 {
  min-width: 145px;
}

.mw-146 {
  min-width: 146px;
}

.mw-147 {
  min-width: 147px;
}

.mw-148 {
  min-width: 148px;
}

.mw-149 {
  min-width: 149px;
}

.mw-150 {
  min-width: 150px;
}

.mw-151 {
  min-width: 151px;
}

.mw-152 {
  min-width: 152px;
}

.mw-153 {
  min-width: 153px;
}

.mw-154 {
  min-width: 154px;
}

.mw-155 {
  min-width: 155px;
}

.mw-156 {
  min-width: 156px;
}

.mw-157 {
  min-width: 157px;
}

.mw-158 {
  min-width: 158px;
}

.mw-159 {
  min-width: 159px;
}

.mw-160 {
  min-width: 160px;
}

.mw-161 {
  min-width: 161px;
}

.mw-162 {
  min-width: 162px;
}

.mw-163 {
  min-width: 163px;
}

.mw-164 {
  min-width: 164px;
}

.mw-165 {
  min-width: 165px;
}

.mw-166 {
  min-width: 166px;
}

.mw-167 {
  min-width: 167px;
}

.mw-168 {
  min-width: 168px;
}

.mw-169 {
  min-width: 169px;
}

.mw-170 {
  min-width: 170px;
}

.mw-171 {
  min-width: 171px;
}

.mw-172 {
  min-width: 172px;
}

.mw-173 {
  min-width: 173px;
}

.mw-174 {
  min-width: 174px;
}

.mw-175 {
  min-width: 175px;
}

.mw-176 {
  min-width: 176px;
}

.mw-177 {
  min-width: 177px;
}

.mw-178 {
  min-width: 178px;
}

.mw-179 {
  min-width: 179px;
}

.mw-180 {
  min-width: 180px;
}

.mw-181 {
  min-width: 181px;
}

.mw-182 {
  min-width: 182px;
}

.mw-183 {
  min-width: 183px;
}

.mw-184 {
  min-width: 184px;
}

.mw-185 {
  min-width: 185px;
}

.mw-186 {
  min-width: 186px;
}

.mw-187 {
  min-width: 187px;
}

.mw-188 {
  min-width: 188px;
}

.mw-189 {
  min-width: 189px;
}

.mw-190 {
  min-width: 190px;
}

.mw-191 {
  min-width: 191px;
}

.mw-192 {
  min-width: 192px;
}

.mw-193 {
  min-width: 193px;
}

.mw-194 {
  min-width: 194px;
}

.mw-195 {
  min-width: 195px;
}

.mw-196 {
  min-width: 196px;
}

.mw-197 {
  min-width: 197px;
}

.mw-198 {
  min-width: 198px;
}

.mw-199 {
  min-width: 199px;
}

.mw-200 {
  min-width: 200px;
}

.mw-201 {
  min-width: 201px;
}

.mw-202 {
  min-width: 202px;
}

.mw-203 {
  min-width: 203px;
}

.mw-204 {
  min-width: 204px;
}

.mw-205 {
  min-width: 205px;
}

.mw-206 {
  min-width: 206px;
}

.mw-207 {
  min-width: 207px;
}

.mw-208 {
  min-width: 208px;
}

.mw-209 {
  min-width: 209px;
}

.mw-210 {
  min-width: 210px;
}

.mw-211 {
  min-width: 211px;
}

.mw-212 {
  min-width: 212px;
}

.mw-213 {
  min-width: 213px;
}

.mw-214 {
  min-width: 214px;
}

.mw-215 {
  min-width: 215px;
}

.mw-216 {
  min-width: 216px;
}

.mw-217 {
  min-width: 217px;
}

.mw-218 {
  min-width: 218px;
}

.mw-219 {
  min-width: 219px;
}

.mw-220 {
  min-width: 220px;
}

.mw-221 {
  min-width: 221px;
}

.mw-222 {
  min-width: 222px;
}

.mw-223 {
  min-width: 223px;
}

.mw-224 {
  min-width: 224px;
}

.mw-225 {
  min-width: 225px;
}

.mw-226 {
  min-width: 226px;
}

.mw-227 {
  min-width: 227px;
}

.mw-228 {
  min-width: 228px;
}

.mw-229 {
  min-width: 229px;
}

.mw-230 {
  min-width: 230px;
}

.mw-231 {
  min-width: 231px;
}

.mw-232 {
  min-width: 232px;
}

.mw-233 {
  min-width: 233px;
}

.mw-234 {
  min-width: 234px;
}

.mw-235 {
  min-width: 235px;
}

.mw-236 {
  min-width: 236px;
}

.mw-237 {
  min-width: 237px;
}

.mw-238 {
  min-width: 238px;
}

.mw-239 {
  min-width: 239px;
}

.mw-240 {
  min-width: 240px;
}

.mw-241 {
  min-width: 241px;
}

.mw-242 {
  min-width: 242px;
}

.mw-243 {
  min-width: 243px;
}

.mw-244 {
  min-width: 244px;
}

.mw-245 {
  min-width: 245px;
}

.mw-246 {
  min-width: 246px;
}

.mw-247 {
  min-width: 247px;
}

.mw-248 {
  min-width: 248px;
}

.mw-249 {
  min-width: 249px;
}

.mw-250 {
  min-width: 250px;
}

.mw-251 {
  min-width: 251px;
}

.mw-252 {
  min-width: 252px;
}

.mw-253 {
  min-width: 253px;
}

.mw-254 {
  min-width: 254px;
}

.mw-255 {
  min-width: 255px;
}

.mw-256 {
  min-width: 256px;
}

.mw-257 {
  min-width: 257px;
}

.mw-258 {
  min-width: 258px;
}

.mw-259 {
  min-width: 259px;
}

.mw-260 {
  min-width: 260px;
}

.mw-261 {
  min-width: 261px;
}

.mw-262 {
  min-width: 262px;
}

.mw-263 {
  min-width: 263px;
}

.mw-264 {
  min-width: 264px;
}

.mw-265 {
  min-width: 265px;
}

.mw-266 {
  min-width: 266px;
}

.mw-267 {
  min-width: 267px;
}

.mw-268 {
  min-width: 268px;
}

.mw-269 {
  min-width: 269px;
}

.mw-270 {
  min-width: 270px;
}

.mw-271 {
  min-width: 271px;
}

.mw-272 {
  min-width: 272px;
}

.mw-273 {
  min-width: 273px;
}

.mw-274 {
  min-width: 274px;
}

.mw-275 {
  min-width: 275px;
}

.mw-276 {
  min-width: 276px;
}

.mw-277 {
  min-width: 277px;
}

.mw-278 {
  min-width: 278px;
}

.mw-279 {
  min-width: 279px;
}

.mw-280 {
  min-width: 280px;
}

.mw-281 {
  min-width: 281px;
}

.mw-282 {
  min-width: 282px;
}

.mw-283 {
  min-width: 283px;
}

.mw-284 {
  min-width: 284px;
}

.mw-285 {
  min-width: 285px;
}

.mw-286 {
  min-width: 286px;
}

.mw-287 {
  min-width: 287px;
}

.mw-288 {
  min-width: 288px;
}

.mw-289 {
  min-width: 289px;
}

.mw-290 {
  min-width: 290px;
}

.mw-291 {
  min-width: 291px;
}

.mw-292 {
  min-width: 292px;
}

.mw-293 {
  min-width: 293px;
}

.mw-294 {
  min-width: 294px;
}

.mw-295 {
  min-width: 295px;
}

.mw-296 {
  min-width: 296px;
}

.mw-297 {
  min-width: 297px;
}

.mw-298 {
  min-width: 298px;
}

.mw-299 {
  min-width: 299px;
}

.mw-300 {
  min-width: 300px;
}

.mw-301 {
  min-width: 301px;
}

.mw-302 {
  min-width: 302px;
}

.mw-303 {
  min-width: 303px;
}

.mw-304 {
  min-width: 304px;
}

.mw-305 {
  min-width: 305px;
}

.mw-306 {
  min-width: 306px;
}

.mw-307 {
  min-width: 307px;
}

.mw-308 {
  min-width: 308px;
}

.mw-309 {
  min-width: 309px;
}

.mw-310 {
  min-width: 310px;
}

.mw-311 {
  min-width: 311px;
}

.mw-312 {
  min-width: 312px;
}

.mw-313 {
  min-width: 313px;
}

.mw-314 {
  min-width: 314px;
}

.mw-315 {
  min-width: 315px;
}

.mw-316 {
  min-width: 316px;
}

.mw-317 {
  min-width: 317px;
}

.mw-318 {
  min-width: 318px;
}

.mw-319 {
  min-width: 319px;
}

.mw-320 {
  min-width: 320px;
}

.mw-321 {
  min-width: 321px;
}

.mw-322 {
  min-width: 322px;
}

.mw-323 {
  min-width: 323px;
}

.mw-324 {
  min-width: 324px;
}

.mw-325 {
  min-width: 325px;
}

.mw-326 {
  min-width: 326px;
}

.mw-327 {
  min-width: 327px;
}

.mw-328 {
  min-width: 328px;
}

.mw-329 {
  min-width: 329px;
}

.mw-330 {
  min-width: 330px;
}

.mw-331 {
  min-width: 331px;
}

.mw-332 {
  min-width: 332px;
}

.mw-333 {
  min-width: 333px;
}

.mw-334 {
  min-width: 334px;
}

.mw-335 {
  min-width: 335px;
}

.mw-336 {
  min-width: 336px;
}

.mw-337 {
  min-width: 337px;
}

.mw-338 {
  min-width: 338px;
}

.mw-339 {
  min-width: 339px;
}

.mw-340 {
  min-width: 340px;
}

.mw-341 {
  min-width: 341px;
}

.mw-342 {
  min-width: 342px;
}

.mw-343 {
  min-width: 343px;
}

.mw-344 {
  min-width: 344px;
}

.mw-345 {
  min-width: 345px;
}

.mw-346 {
  min-width: 346px;
}

.mw-347 {
  min-width: 347px;
}

.mw-348 {
  min-width: 348px;
}

.mw-349 {
  min-width: 349px;
}

.mw-350 {
  min-width: 350px;
}


.panel-bg-mdi {
  background-color: rgba(154, 207, 234, 0.25);
}

.textarea-100 {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
}

.border-info-dashboard {
  border-color: #337ab7
}

.dashboard-provider-header,
.dashboard-provider-header h4,
.dashboard-provider-header p {
  color: #fff;
}

.dashboard-provider-header .btn-link,
.dashboard-provider-header .btn-link:hover,
.dashboard-provider-header .btn-link:focus {
  color: #fff !important;
}

.dashboard-provider-header-link,
.dashboard-provider-header-link:hover,
.dashboard-provider-header-link:focus {
  color: #fff !important;
}

.btn-dashboard-add-edit {
  min-width: 70px;
}

.bg-light-danger {
  background-color: rgb(234, 150, 150, 0.08);
}

.bg-light-info {
  background-color: rgba(154, 207, 234, 0.25);
}

.nickelled-cards {
  border-radius: 15px;
  border-right-width: thick;
  border-bottom-width: thick;
  border-color: #bce8f1;
}

.dt-slim-border tbody > tr,
.dt-slim-border tbody > tr > td {
  border-bottom: 1px solid #ddd;
}

img.loading {
  width: 250px;
  height: 250px;
  margin: auto;
}

.loading-container {
  width: 100%;
}

.loading-container--full {
  min-height: 60vh;
}

.loading-container--modal {
  min-height: 240px;
}


div#toolbox_export_pi {
  position: absolute;
  top: 20px;
  right: 10px;
  width: 260px;
  display: block
}

.alert-default {
  color: #333;
  background-color: #f5f5f5;
  border-color: #ddd;
}

.alert-default hr {
  border-top-color: #ddd;
}

.alert-info .alert-link {
  color: #333;
}

.pi-form-label {
  min-width: 125px;
}

.under-line-primary:after {
  content: '';
  background: #337ab7;
  width: 100%;
  height: 2px;
  display: block;
}

.under-line-info:after {
  content: '';
  background: #d9edf7;
  width: 100%;
  height: 2px;
  display: block;
}

.under-line-success:after {
  content: '';
  background: #dff0d8;
  width: 100%;
  height: 2px;
  display: block;
}

.under-line-danger:after {
  content: '';
  background: #f2dede;
  width: 100%;
  height: 2px;
  display: block;
}

.under-line-warning:after {
  content: '';
  background: #fcf8e3;
  width: 100%;
  height: 2px;
  display: block;
}

.under-line-default:after {
  content: '';
  background: #ddd;
  width: 100%;
  height: 2px;
  display: block;
}

.panel-default.dark > .panel-heading {
  color: #333;
  background-color: #dddddd;
  border-color: #c0c0c0;
}

.text-center-vertical {
  vertical-align: center
}

.click-me, .extraMeasureInfo, .etooltip {
  cursor: pointer;
}

.panel-success-warning {
  border: 2px solid;
  border-color: #eea236;
}

.d-flex {
  display: flex;
}

.d-flex.nowrap {
  flex-wrap: nowrap;
}

.no-wrap {
  white-space: nowrap;
}

.max-h-1 {
  max-height: 1px;
}

.max-h-2 {
  max-height: 2px;
}

.max-h-3 {
  max-height: 3px;
}

.max-h-4 {
  max-height: 4px;
}

.max-h-5 {
  max-height: 5px;
}

.max-h-6 {
  max-height: 6px;
}

.max-h-7 {
  max-height: 7px;
}

.max-h-8 {
  max-height: 8px;
}

.max-h-9 {
  max-height: 9px;
}

.max-h-10 {
  max-height: 10px;
}

.max-h-11 {
  max-height: 11px;
}

.max-h-12 {
  max-height: 12px;
}

.max-h-13 {
  max-height: 13px;
}

.max-h-14 {
  max-height: 14px;
}

.max-h-15 {
  max-height: 15px;
}

.max-h-16 {
  max-height: 16px;
}

.max-h-17 {
  max-height: 17px;
}

.max-h-18 {
  max-height: 18px;
}

.max-h-19 {
  max-height: 19px;
}

.max-h-20 {
  max-height: 20px;
}

.max-h-21 {
  max-height: 21px;
}

.max-h-22 {
  max-height: 22px;
}

.max-h-23 {
  max-height: 23px;
}

.max-h-24 {
  max-height: 24px;
}

.max-h-25 {
  max-height: 25px;
}

.max-h-26 {
  max-height: 26px;
}

.max-h-27 {
  max-height: 27px;
}

.max-h-28 {
  max-height: 28px;
}

.max-h-29 {
  max-height: 29px;
}

.max-h-30 {
  max-height: 30px;
}

.max-h-31 {
  max-height: 31px;
}

.max-h-32 {
  max-height: 32px;
}

.max-h-33 {
  max-height: 33px;
}

.max-h-34 {
  max-height: 34px;
}

.max-h-35 {
  max-height: 35px;
}

.max-h-36 {
  max-height: 36px;
}

.max-h-37 {
  max-height: 37px;
}

.max-h-38 {
  max-height: 38px;
}

.max-h-39 {
  max-height: 39px;
}

.max-h-40 {
  max-height: 40px;
}

.max-h-41 {
  max-height: 41px;
}

.max-h-42 {
  max-height: 42px;
}

.max-h-43 {
  max-height: 43px;
}

.max-h-44 {
  max-height: 44px;
}

.max-h-45 {
  max-height: 45px;
}

.max-h-46 {
  max-height: 46px;
}

.max-h-47 {
  max-height: 47px;
}

.max-h-48 {
  max-height: 48px;
}

.max-h-49 {
  max-height: 49px;
}

.max-h-50 {
  max-height: 50px;
}

.max-h-51 {
  max-height: 51px;
}

.max-h-52 {
  max-height: 52px;
}

.max-h-53 {
  max-height: 53px;
}

.max-h-54 {
  max-height: 54px;
}

.max-h-55 {
  max-height: 55px;
}

.max-h-56 {
  max-height: 56px;
}

.max-h-57 {
  max-height: 57px;
}

.max-h-58 {
  max-height: 58px;
}

.max-h-59 {
  max-height: 59px;
}

.max-h-60 {
  max-height: 60px;
}

.max-h-61 {
  max-height: 61px;
}

.max-h-62 {
  max-height: 62px;
}

.max-h-63 {
  max-height: 63px;
}

.max-h-64 {
  max-height: 64px;
}

.max-h-65 {
  max-height: 65px;
}

.max-h-66 {
  max-height: 66px;
}

.max-h-67 {
  max-height: 67px;
}

.max-h-68 {
  max-height: 68px;
}

.max-h-69 {
  max-height: 69px;
}

.max-h-70 {
  max-height: 70px;
}

.max-h-71 {
  max-height: 71px;
}

.max-h-72 {
  max-height: 72px;
}

.max-h-73 {
  max-height: 73px;
}

.max-h-74 {
  max-height: 74px;
}

.max-h-75 {
  max-height: 75px;
}

.a-link {
  text-decoration: underline;
}

.pos-abs {
  position: absolute;
}

.pos-rel {
  position: relative;
}

.fhir-container__ResourceContainer__json--hidden {
  display: none;
}

.max-w-2 {
  max-width: 2vw !important;
}

.max-w-5 {
  max-width: 5vw !important;
}

.max-w-7 {
  max-width: 7vw !important;
}

.max-w-8 {
  max-width: 8vw !important;
}

.max-w-10 {
  max-width: 10vw;
}

.max-w-20 {
  max-width: 20vw;
}

.max-w-30 {
  max-width: 30vw;
}

.max-w-35 {
  max-width: 30vw;
}

.max-w-40 {
  max-width: 40vw;
}

.max-w-50 {
  max-width: 50vw;
}

.max-w-60 {
  max-width: 60vw;
}

.max-w-70 {
  max-width: 70vw;
}

.max-w-80 {
  max-width: 80vw;
}

.max-w-90 {
  max-width: 90vw;
}

.max-w-92 {
  max-width: 92vw;
}

.max-w-94 {
  max-width: 94vw;
}

.max-w-95 {
  max-width: 95vw;
}

.max-w-97 {
  max-width: 97vw;
}

.max-w-99 {
  max-width: 99vw;
}


.max-w-100 {
  max-width: 100vw;
}

.item-even, even {
  background-color: rgba(154, 207, 234, 0.25);
}

.item-odd, odd {
  background-color: rgba(154, 207, 234, 0.05);
}

.display-inherit {
  display: inherit;
}

.hr-with-text {
  display: flex;
  align-items: center;
}

.hr-with-text hr {
  flex-grow: 1;
  height: 1px;
  background-color: #337ab7;
  margin: 0;
}

.hr-with-text span {
  padding: 0 10px;
  color: #337ab7;
}

.pr-suggestion-box {
  background-color: #ffffff;
  border: 1px solid #ccc;
  border-radius: 4px;
  width: 100%;
  height: 300px;
  max-height: 300px;
  overflow-y: auto;
  padding: 8px;
}

.zindex-unset {
  z-index: unset !important;
}

.simple-table-container {
  overflow: auto;
  max-height: 100%; /* Set a max height for the table container */
}

.simple-table-container thead th {
  position: sticky;
  top: 0;
  background-color: #337ab7;
  color: #fff;
}

/* MIPS-6502 — Freeze the MIPS/ACO measures table header row so the column
   headers stay visible while scrolling through long data sets (previously
   they scrolled out of view, especially in accounts with PI data). Scoped to
   the overview table via .measures-sticky-header so the shared .table_measures
   class used elsewhere is unaffected. A background + shadow keep the striped
   body rows from showing through the sticky header. */
.table_measures.measures-sticky-header thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background-color: #fff;
  box-shadow: inset 0 1px 0 #ddd, inset 0 -1px 0 #ddd;
}

.table-hover > tbody > tr:hover {
  border: dotted 3px #0a6dcf;
  border-radius: 4px;
}

/* Add hover effect */
.table-hover .item-even:hover,
.table-hover .item-odd:hover {
  border: dotted 3px #0a6dcf;
  /*background-color: #e0f7fa;*/
  border-color: #005b99;
}

.card {
  background-color: #ffffff;
  border: 1px solid transparent;
  border-radius: 6px;
}

.card > .card-link {
  color: #333;
}

.card > .card-link:hover {
  text-decoration: none;
}

.card > .card-link .card-img img {
  border-radius: 6px 6px 0 0;
}

.card .card-img {
  position: relative;
  padding: 0;
  display: table;
}

.card .card-img .card-caption {
  position: absolute;
  right: 0;
  bottom: 16px;
  left: 0;
}

.card .card-body {
  display: table;
  width: 100%;
  padding: 12px;
}

.card .card-header {
  border-radius: 6px 6px 0 0;
  padding: 8px;
}

.card .card-footer {
  border-radius: 0 0 6px 6px;
  padding: 8px;
}

.card .card-left {
  position: relative;
  float: left;
  padding: 0 0 8px 0;
}

.card .card-right {
  position: relative;
  float: left;
  padding: 8px 0 0 0;
}

.card .card-body h1:first-child,
.card .card-body h2:first-child,
.card .card-body h3:first-child,
.card .card-body h4:first-child,
.card .card-body .h1,
.card .card-body .h2,
.card .card-body .h3,
.card .card-body .h4 {
  margin-top: 0;
}

.card .card-body .heading {
  display: block;
}

.card .card-body .heading:last-child {
  margin-bottom: 0;
}

.card .card-body .lead {
  text-align: center;
}

@media ( min-width: 768px ) {
  .card .card-left {
    float: left;
    padding: 0 8px 0 0;
  }
  
  .card .card-right {
    float: left;
    padding: 0 0 0 8px;
  }
  
  .card .card-4-8 .card-left {
    width: 33.33333333%;
  }
  
  .card .card-4-8 .card-right {
    width: 66.66666667%;
  }
  
  .card .card-5-7 .card-left {
    width: 41.66666667%;
  }
  
  .card .card-5-7 .card-right {
    width: 58.33333333%;
  }
  
  .card .card-6-6 .card-left {
    width: 50%;
  }
  
  .card .card-6-6 .card-right {
    width: 50%;
  }
  
  .card .card-7-5 .card-left {
    width: 58.33333333%;
  }
  
  .card .card-7-5 .card-right {
    width: 41.66666667%;
  }
  
  .card .card-8-4 .card-left {
    width: 66.66666667%;
  }
  
  .card .card-8-4 .card-right {
    width: 33.33333333%;
  }
}

/* -- default theme ------ */
.card-default {
  border-color: #ddd;
  background-color: #ffffff;
  margin-bottom: 24px;
}

.card-default > .card-header,
.card-default > .card-footer {
  color: #333;
  background-color: #ddd;
}

.card-default > .card-header {
  border-bottom: 1px solid #ddd;
  padding: 8px;
}

.card-default > .card-footer {
  border-top: 1px solid #ddd;
  padding: 8px;
}

.card-default > .card-body {
}

.card-default > .card-img:first-child img {
  border-radius: 6px 6px 0 0;
}

.card-default > .card-left {
  padding-right: 4px;
}

.card-default > .card-right {
  padding-left: 4px;
}

.card-default p:last-child {
  margin-bottom: 0;
}

.card-default .card-caption {
  color: #fff;
  text-align: center;
  text-transform: uppercase;
}


/* -- price theme ------ */
.card-price {
  border-color: #999;
  background-color: #ededed;
  margin-bottom: 24px;
}

.card-price > .card-heading,
.card-price > .card-footer {
  color: #333;
  background-color: #fdfdfd;
}

.card-price > .card-heading {
  border-bottom: 1px solid #ddd;
  padding: 8px;
}

.card-price > .card-footer {
  border-top: 1px solid #ddd;
  padding: 8px;
}

.card-price > .card-img:first-child img {
  border-radius: 6px 6px 0 0;
}

.card-price > .card-left {
  padding-right: 4px;
}

.card-price > .card-right {
  padding-left: 4px;
}

.card-price .card-caption {
  color: #fff;
  text-align: center;
  text-transform: uppercase;
}

.card-price p:last-child {
  margin-bottom: 0;
}

.card-price .price {
  text-align: center;
  color: #337ab7;
  font-size: 3em;
  text-transform: uppercase;
  line-height: 0.7em;
  margin: 24px 0 16px;
}

.card-price .price small {
  font-size: 0.4em;
  color: #66a5da;
}

.card-price .details {
  list-style: none;
  margin-bottom: 24px;
  padding: 0 18px;
}

.card-price .details li {
  text-align: center;
  margin-bottom: 8px;
}

.card-price .buy-now {
  text-transform: uppercase;
}

.card-price table .price {
  font-size: 1.2em;
  font-weight: 700;
  text-align: left;
}

.card-price table .note {
  color: #666;
  font-size: 0.8em;
}

.row-bs5 {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(var(--bs-gutter-y) * -1);
  margin-right: calc(var(--bs-gutter-x) * -.5);
  margin-left: calc(var(--bs-gutter-x) * -.5);
}

.row-bs5 > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5);
  margin-top: var(--bs-gutter-y);
}


.col {
  flex: 1 0 0%;
}

.row-cols-auto > * {
  flex: 0 0 auto;
  width: auto;
}

.row-cols-1 > * {
  flex: 0 0 auto;
  width: 100%;
}

.row-cols-2 > * {
  flex: 0 0 auto;
  width: 50%;
}

.row-cols-3 > * {
  flex: 0 0 auto;
  width: 33.3333333333%;
}

.row-cols-4 > * {
  flex: 0 0 auto;
  width: 25%;
}

.row-cols-5 > * {
  flex: 0 0 auto;
  width: 20%;
}

.row-cols-6 > * {
  flex: 0 0 auto;
  width: 16.6666666667%;
}

@media (min-width: 576px) {
  .col-sm {
    flex: 1 0 0%;
  }
  
  .row-cols-sm-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  
  .row-cols-sm-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .row-cols-sm-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .row-cols-sm-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  
  .row-cols-sm-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .row-cols-sm-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  
  .row-cols-sm-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

@media (min-width: 768px) {
  .col-md {
    flex: 1 0 0%;
  }
  
  .row-cols-md-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  
  .row-cols-md-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .row-cols-md-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .row-cols-md-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  
  .row-cols-md-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .row-cols-md-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  
  .row-cols-md-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

@media (min-width: 992px) {
  .col-lg {
    flex: 1 0 0%;
  }
  
  .row-cols-lg-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  
  .row-cols-lg-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .row-cols-lg-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .row-cols-lg-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  
  .row-cols-lg-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .row-cols-lg-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  
  .row-cols-lg-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

@media (min-width: 1200px) {
  .col-xl {
    flex: 1 0 0%;
  }
  
  .row-cols-xl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  
  .row-cols-xl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .row-cols-xl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .row-cols-xl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  
  .row-cols-xl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .row-cols-xl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  
  .row-cols-xl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

@media (min-width: 1400px) {
  .col-xxl {
    flex: 1 0 0%;
  }
  
  .row-cols-xxl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  
  .row-cols-xxl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .row-cols-xxl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .row-cols-xxl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  
  .row-cols-xxl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .row-cols-xxl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  
  .row-cols-xxl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

.col-auto {
  flex: 0 0 auto;
  width: auto;
}

.col-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}

.col-2 {
  flex: 0 0 auto;
  width: 16.66666667%;
}

.col-3 {
  flex: 0 0 auto;
  width: 25%;
}

.col-4 {
  flex: 0 0 auto;
  width: 33.33333333%;
}

.col-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}

.col-6 {
  flex: 0 0 auto;
  width: 50%;
}

.col-7 {
  flex: 0 0 auto;
  width: 58.33333333%;
}

.col-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}

.col-9 {
  flex: 0 0 auto;
  width: 75%;
}

.col-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}

.col-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}

.col-12 {
  flex: 0 0 auto;
  width: 100%;
}

.offset-1 {
  margin-left: 8.33333333%;
}

.offset-2 {
  margin-left: 16.66666667%;
}

.offset-3 {
  margin-left: 25%;
}

.offset-4 {
  margin-left: 33.33333333%;
}

.offset-5 {
  margin-left: 41.66666667%;
}

.offset-6 {
  margin-left: 50%;
}

.offset-7 {
  margin-left: 58.33333333%;
}

.offset-8 {
  margin-left: 66.66666667%;
}

.offset-9 {
  margin-left: 75%;
}

.offset-10 {
  margin-left: 83.33333333%;
}

.offset-11 {
  margin-left: 91.66666667%;
}

.g-0,
.gx-0 {
  --bs-gutter-x: 0;
}

.g-0,
.gy-0 {
  --bs-gutter-y: 0;
}

.g-1,
.gx-1 {
  --bs-gutter-x: 0.25rem;
}

.g-1,
.gy-1 {
  --bs-gutter-y: 0.25rem;
}

.g-2,
.gx-2 {
  --bs-gutter-x: 0.5rem;
}

.g-2,
.gy-2 {
  --bs-gutter-y: 0.5rem;
}

.g-3,
.gx-3 {
  --bs-gutter-x: 1rem;
}

.g-3,
.gy-3 {
  --bs-gutter-y: 1rem;
}

.g-4,
.gx-4 {
  --bs-gutter-x: 1.5rem;
}

.g-4,
.gy-4 {
  --bs-gutter-y: 1.5rem;
}

.g-5,
.gx-5 {
  --bs-gutter-x: 3rem;
}

.g-5,
.gy-5 {
  --bs-gutter-y: 3rem;
}

@media (min-width: 576px) {
  .col-sm-auto {
    flex: 0 0 auto;
    width: auto;
  }
  
  .col-sm-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  
  .col-sm-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  
  .col-sm-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .col-sm-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  
  .col-sm-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  
  .col-sm-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .col-sm-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  
  .col-sm-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  
  .col-sm-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  
  .col-sm-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  
  .col-sm-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  
  .col-sm-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .offset-sm-0 {
    margin-left: 0;
  }
  
  .offset-sm-1 {
    margin-left: 8.33333333%;
  }
  
  .offset-sm-2 {
    margin-left: 16.66666667%;
  }
  
  .offset-sm-3 {
    margin-left: 25%;
  }
  
  .offset-sm-4 {
    margin-left: 33.33333333%;
  }
  
  .offset-sm-5 {
    margin-left: 41.66666667%;
  }
  
  .offset-sm-6 {
    margin-left: 50%;
  }
  
  .offset-sm-7 {
    margin-left: 58.33333333%;
  }
  
  .offset-sm-8 {
    margin-left: 66.66666667%;
  }
  
  .offset-sm-9 {
    margin-left: 75%;
  }
  
  .offset-sm-10 {
    margin-left: 83.33333333%;
  }
  
  .offset-sm-11 {
    margin-left: 91.66666667%;
  }
  
  .g-sm-0,
  .gx-sm-0 {
    --bs-gutter-x: 0;
  }
  
  .g-sm-0,
  .gy-sm-0 {
    --bs-gutter-y: 0;
  }
  
  .g-sm-1,
  .gx-sm-1 {
    --bs-gutter-x: 0.25rem;
  }
  
  .g-sm-1,
  .gy-sm-1 {
    --bs-gutter-y: 0.25rem;
  }
  
  .g-sm-2,
  .gx-sm-2 {
    --bs-gutter-x: 0.5rem;
  }
  
  .g-sm-2,
  .gy-sm-2 {
    --bs-gutter-y: 0.5rem;
  }
  
  .g-sm-3,
  .gx-sm-3 {
    --bs-gutter-x: 1rem;
  }
  
  .g-sm-3,
  .gy-sm-3 {
    --bs-gutter-y: 1rem;
  }
  
  .g-sm-4,
  .gx-sm-4 {
    --bs-gutter-x: 1.5rem;
  }
  
  .g-sm-4,
  .gy-sm-4 {
    --bs-gutter-y: 1.5rem;
  }
  
  .g-sm-5,
  .gx-sm-5 {
    --bs-gutter-x: 3rem;
  }
  
  .g-sm-5,
  .gy-sm-5 {
    --bs-gutter-y: 3rem;
  }
}

@media (min-width: 768px) {
  .col-md-auto {
    flex: 0 0 auto;
    width: auto;
  }
  
  .col-md-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  
  .col-md-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  
  .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  
  .col-md-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  
  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .col-md-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  
  .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  
  .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  
  .col-md-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  
  .col-md-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  
  .col-md-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .offset-md-0 {
    margin-left: 0;
  }
  
  .offset-md-1 {
    margin-left: 8.33333333%;
  }
  
  .offset-md-2 {
    margin-left: 16.66666667%;
  }
  
  .offset-md-3 {
    margin-left: 25%;
  }
  
  .offset-md-4 {
    margin-left: 33.33333333%;
  }
  
  .offset-md-5 {
    margin-left: 41.66666667%;
  }
  
  .offset-md-6 {
    margin-left: 50%;
  }
  
  .offset-md-7 {
    margin-left: 58.33333333%;
  }
  
  .offset-md-8 {
    margin-left: 66.66666667%;
  }
  
  .offset-md-9 {
    margin-left: 75%;
  }
  
  .offset-md-10 {
    margin-left: 83.33333333%;
  }
  
  .offset-md-11 {
    margin-left: 91.66666667%;
  }
  
  .g-md-0,
  .gx-md-0 {
    --bs-gutter-x: 0;
  }
  
  .g-md-0,
  .gy-md-0 {
    --bs-gutter-y: 0;
  }
  
  .g-md-1,
  .gx-md-1 {
    --bs-gutter-x: 0.25rem;
  }
  
  .g-md-1,
  .gy-md-1 {
    --bs-gutter-y: 0.25rem;
  }
  
  .g-md-2,
  .gx-md-2 {
    --bs-gutter-x: 0.5rem;
  }
  
  .g-md-2,
  .gy-md-2 {
    --bs-gutter-y: 0.5rem;
  }
  
  .g-md-3,
  .gx-md-3 {
    --bs-gutter-x: 1rem;
  }
  
  .g-md-3,
  .gy-md-3 {
    --bs-gutter-y: 1rem;
  }
  
  .g-md-4,
  .gx-md-4 {
    --bs-gutter-x: 1.5rem;
  }
  
  .g-md-4,
  .gy-md-4 {
    --bs-gutter-y: 1.5rem;
  }
  
  .g-md-5,
  .gx-md-5 {
    --bs-gutter-x: 3rem;
  }
  
  .g-md-5,
  .gy-md-5 {
    --bs-gutter-y: 3rem;
  }
}

@media (min-width: 992px) {
  .col-lg-auto {
    flex: 0 0 auto;
    width: auto;
  }
  
  .col-lg-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  
  .col-lg-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  
  .col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .col-lg-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  
  .col-lg-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  
  .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .col-lg-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  
  .col-lg-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  
  .col-lg-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  
  .col-lg-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  
  .col-lg-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  
  .col-lg-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .offset-lg-0 {
    margin-left: 0;
  }
  
  .offset-lg-1 {
    margin-left: 8.33333333%;
  }
  
  .offset-lg-2 {
    margin-left: 16.66666667%;
  }
  
  .offset-lg-3 {
    margin-left: 25%;
  }
  
  .offset-lg-4 {
    margin-left: 33.33333333%;
  }
  
  .offset-lg-5 {
    margin-left: 41.66666667%;
  }
  
  .offset-lg-6 {
    margin-left: 50%;
  }
  
  .offset-lg-7 {
    margin-left: 58.33333333%;
  }
  
  .offset-lg-8 {
    margin-left: 66.66666667%;
  }
  
  .offset-lg-9 {
    margin-left: 75%;
  }
  
  .offset-lg-10 {
    margin-left: 83.33333333%;
  }
  
  .offset-lg-11 {
    margin-left: 91.66666667%;
  }
  
  .g-lg-0,
  .gx-lg-0 {
    --bs-gutter-x: 0;
  }
  
  .g-lg-0,
  .gy-lg-0 {
    --bs-gutter-y: 0;
  }
  
  .g-lg-1,
  .gx-lg-1 {
    --bs-gutter-x: 0.25rem;
  }
  
  .g-lg-1,
  .gy-lg-1 {
    --bs-gutter-y: 0.25rem;
  }
  
  .g-lg-2,
  .gx-lg-2 {
    --bs-gutter-x: 0.5rem;
  }
  
  .g-lg-2,
  .gy-lg-2 {
    --bs-gutter-y: 0.5rem;
  }
  
  .g-lg-3,
  .gx-lg-3 {
    --bs-gutter-x: 1rem;
  }
  
  .g-lg-3,
  .gy-lg-3 {
    --bs-gutter-y: 1rem;
  }
  
  .g-lg-4,
  .gx-lg-4 {
    --bs-gutter-x: 1.5rem;
  }
  
  .g-lg-4,
  .gy-lg-4 {
    --bs-gutter-y: 1.5rem;
  }
  
  .g-lg-5,
  .gx-lg-5 {
    --bs-gutter-x: 3rem;
  }
  
  .g-lg-5,
  .gy-lg-5 {
    --bs-gutter-y: 3rem;
  }
}

@media (min-width: 1200px) {
  .col-xl-auto {
    flex: 0 0 auto;
    width: auto;
  }
  
  .col-xl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  
  .col-xl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  
  .col-xl-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .col-xl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  
  .col-xl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  
  .col-xl-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .col-xl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  
  .col-xl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  
  .col-xl-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  
  .col-xl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  
  .col-xl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  
  .col-xl-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .offset-xl-0 {
    margin-left: 0;
  }
  
  .offset-xl-1 {
    margin-left: 8.33333333%;
  }
  
  .offset-xl-2 {
    margin-left: 16.66666667%;
  }
  
  .offset-xl-3 {
    margin-left: 25%;
  }
  
  .offset-xl-4 {
    margin-left: 33.33333333%;
  }
  
  .offset-xl-5 {
    margin-left: 41.66666667%;
  }
  
  .offset-xl-6 {
    margin-left: 50%;
  }
  
  .offset-xl-7 {
    margin-left: 58.33333333%;
  }
  
  .offset-xl-8 {
    margin-left: 66.66666667%;
  }
  
  .offset-xl-9 {
    margin-left: 75%;
  }
  
  .offset-xl-10 {
    margin-left: 83.33333333%;
  }
  
  .offset-xl-11 {
    margin-left: 91.66666667%;
  }
  
  .g-xl-0,
  .gx-xl-0 {
    --bs-gutter-x: 0;
  }
  
  .g-xl-0,
  .gy-xl-0 {
    --bs-gutter-y: 0;
  }
  
  .g-xl-1,
  .gx-xl-1 {
    --bs-gutter-x: 0.25rem;
  }
  
  .g-xl-1,
  .gy-xl-1 {
    --bs-gutter-y: 0.25rem;
  }
  
  .g-xl-2,
  .gx-xl-2 {
    --bs-gutter-x: 0.5rem;
  }
  
  .g-xl-2,
  .gy-xl-2 {
    --bs-gutter-y: 0.5rem;
  }
  
  .g-xl-3,
  .gx-xl-3 {
    --bs-gutter-x: 1rem;
  }
  
  .g-xl-3,
  .gy-xl-3 {
    --bs-gutter-y: 1rem;
  }
  
  .g-xl-4,
  .gx-xl-4 {
    --bs-gutter-x: 1.5rem;
  }
  
  .g-xl-4,
  .gy-xl-4 {
    --bs-gutter-y: 1.5rem;
  }
  
  .g-xl-5,
  .gx-xl-5 {
    --bs-gutter-x: 3rem;
  }
  
  .g-xl-5,
  .gy-xl-5 {
    --bs-gutter-y: 3rem;
  }
}

@media (min-width: 1400px) {
  .col-xxl-auto {
    flex: 0 0 auto;
    width: auto;
  }
  
  .col-xxl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  
  .col-xxl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  
  .col-xxl-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  
  .col-xxl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  
  .col-xxl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  
  .col-xxl-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  
  .col-xxl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  
  .col-xxl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  
  .col-xxl-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  
  .col-xxl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  
  .col-xxl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  
  .col-xxl-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  
  .offset-xxl-0 {
    margin-left: 0;
  }
  
  .offset-xxl-1 {
    margin-left: 8.33333333%;
  }
  
  .offset-xxl-2 {
    margin-left: 16.66666667%;
  }
  
  .offset-xxl-3 {
    margin-left: 25%;
  }
  
  .offset-xxl-4 {
    margin-left: 33.33333333%;
  }
  
  .offset-xxl-5 {
    margin-left: 41.66666667%;
  }
  
  .offset-xxl-6 {
    margin-left: 50%;
  }
  
  .offset-xxl-7 {
    margin-left: 58.33333333%;
  }
  
  .offset-xxl-8 {
    margin-left: 66.66666667%;
  }
  
  .offset-xxl-9 {
    margin-left: 75%;
  }
  
  .offset-xxl-10 {
    margin-left: 83.33333333%;
  }
  
  .offset-xxl-11 {
    margin-left: 91.66666667%;
  }
  
  .g-xxl-0,
  .gx-xxl-0 {
    --bs-gutter-x: 0;
  }
  
  .g-xxl-0,
  .gy-xxl-0 {
    --bs-gutter-y: 0;
  }
  
  .g-xxl-1,
  .gx-xxl-1 {
    --bs-gutter-x: 0.25rem;
  }
  
  .g-xxl-1,
  .gy-xxl-1 {
    --bs-gutter-y: 0.25rem;
  }
  
  .g-xxl-2,
  .gx-xxl-2 {
    --bs-gutter-x: 0.5rem;
  }
  
  .g-xxl-2,
  .gy-xxl-2 {
    --bs-gutter-y: 0.5rem;
  }
  
  .g-xxl-3,
  .gx-xxl-3 {
    --bs-gutter-x: 1rem;
  }
  
  .g-xxl-3,
  .gy-xxl-3 {
    --bs-gutter-y: 1rem;
  }
  
  .g-xxl-4,
  .gx-xxl-4 {
    --bs-gutter-x: 1.5rem;
  }
  
  .g-xxl-4,
  .gy-xxl-4 {
    --bs-gutter-y: 1.5rem;
  }
  
  .g-xxl-5,
  .gx-xxl-5 {
    --bs-gutter-x: 3rem;
  }
  
  .g-xxl-5,
  .gy-xxl-5 {
    --bs-gutter-y: 3rem;
  }
}

.label-light-danger {
  background-color: #f2dede;
  color: #a94442;
}

.label-light-warning {
  background-color: #fcf8e3;
  color: #8a6d3b;
}

.label-light-success {
  background-color: #dff0d8;
  color: #3c763d;
}

.label-light-info {
  background-color: #d9edf7;
  color: #31708f;
}

/* Ensuring text color contrasts well and is readable */
.label-light-danger,
.label-light-warning,
.label-light-success,
.label-light-info {
  border: 1px solid #ddd; /* optional: adds a subtle border */
  color: #333; /* darker text for better readability */
}

.label-white {
  background-color: #fff;
  color: #333;
  border: 1px solid #ddd;
  font-weight: 700;
}

.border-danger {
  border: 1px solid #a94442; /* Bootstrap 'danger' color */
}

.border-warning {
  border: 1px solid #8a6d3b; /* Bootstrap 'warning' color */
}

.border-info {
  border: 1px solid #31708f; /* Bootstrap 'info' color */
}

.border-success {
  border: 1px solid #3c763d; /* Bootstrap 'success' color */
}

.toast-mdi {
  max-width: none !important;
}

.toast-mdi > div:nth-child(1) {
  display: block !important;
}

.badge-success {
  background-color: #5cb85c; /* Bootstrap success color */
}

.badge-warning {
  background-color: #f0ad4e; /* Bootstrap warning color */
}

.badge-error, .badge-danger {
  background-color: #d9534f; /* Bootstrap error/danger color */
}

.badge-info {
  background-color: #5bc0de; /* Bootstrap info color */
}

.badge-inverse {
  background-color: #333; /* Bootstrap inverse color */
  color: #fff; /* Make text white */
}

.cache-log-log {
  width: 100%;
  min-width: 50vw;
}


.mdi-scrollbar {
  scrollbar-width: thin; /* For Firefox */
  scrollbar-color: #007bff #f1f1f1; /* Thumb and track colors */
}

.mdi-scrollbar::-webkit-scrollbar {
  width: 12px; /* Width of the scrollbar */
}

.mdi-scrollbar::-webkit-scrollbar-thumb {
  background-color: #007bff; /* Blue color */
  border-radius: 6px; /* Rounded edges */
}

.mdi-scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: #0056b3; /* Darker blue on hover */
}

.mdi-scrollbar::-webkit-scrollbar-track {
  background-color: #f1f1f1; /* Light gray track */
  border-radius: 6px; /* Rounded edges */
}


/* Override the default BS3 tabs */
.nav-tabs {
  border-bottom: 1px solid #0056b3;
}

.nav-tabs > li > a:hover {
  border-color: #d9edf7 #d9edf7 #d4eef8;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
  color: #337ab7;
  cursor: default;
  background-color: #cee8f5;
  border: 1px solid #0056b3;
  border-bottom-color: transparent
}

.nav > li > a:focus,
.nav > li > a:hover {
  text-decoration: none;
  background-color: #d4eef8;
}

/* XS version of form-control-static.input-sm */
.form-control-static.input-xs {
  padding-right: 0;
  padding-left: 0;
}

/* XS version of input-sm */
.input-xs {
  height: 24px; /* Smaller height */
  padding: 3px 8px; /* Reduced padding */
  font-size: 10px; /* Smaller font size */
  line-height: 1.4; /* Adjusted line height */
  border-radius: 3px; /* Consistent border-radius */
}

/* XS version of select.input-sm */
select.input-xs {
  height: 24px; /* Smaller height */
  line-height: 24px; /* Align line-height with height */
}

/* XS version of textarea.input-sm and select[multiple].input-sm */
textarea.input-xs,
select[multiple].input-xs {
  height: auto; /* Keep the height auto for textarea and multiple selects */
}

.nodragcontent {
  cursor: default;
}

/* Strong borders for tables */
.qpp-strong-borders.table-bordered > thead > tr > th,
.qpp-strong-borders.table-bordered > tbody > tr > th,
.qpp-strong-borders.table-bordered > tbody > tr > td {
  border-color: #b5b5b5 !important;
}

.type-count-report-modal {
  background-color: #ffffff;
  color: #212529;
  padding: 15px;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.type-count-report-modal__summary {
  margin-bottom: 12px;
  color: #6c757d;
  font-weight: 500;
}

.type-count-report-modal__filters {
  margin: 0 0 12px;
}

.type-count-report-modal__filter-item {
  margin-bottom: 6px;
  color: #495057;
}

.type-count-report-modal__filter-item strong {
  color: #212529;
}

.type-count-report-modal__table-wrapper {
  max-height: 60vh;
  overflow-y: auto;
}

.type-count-report-modal__empty {
  color: #6c757d;
  margin: 0;
}

.view-tins-modal .modal-dialog {
  max-width: 1000px;
  min-width: 1000px;
}

/* ===========================================
   Dashboard Compact Styles
   =========================================== */

/* Compact panel spacing */
.dashboard-card .panel-heading {
  padding: 10px 12px;
}

.dashboard-card .panel-body {
  padding: 12px;
}

/* Section headers */
.dashboard-card .section-title {
  font-size: 16px;
  color: #000;
  margin: 0 0 8px;
  font-weight: 700;
  letter-spacing: 0;
  text-align: left;
}

/* Compact list-group for Required Actions */
.list-compact .list-group-item {
  padding: 6px 10px;
  line-height: 1.25;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.list-compact .action-name {
  font-weight: 600;
  margin-right: 8px;
  flex: 0 0 150px;
}

.list-compact .action-status {
  flex: 1;
}

.list-compact .action-buttons {
  flex-shrink: 0;
  white-space: nowrap;
}

.list-compact .btn-xs {
  margin-left: 4px;
}

/* Staff panel compact navbar */
.staff-navbar-compact {
  min-height: 24px;
}

.staff-navbar-compact .navbar-nav > li > a,
.staff-navbar-compact .navbar-nav > li > .navbar-link {
  padding-top: 4px;
  padding-bottom: 4px;
  line-height: 16px;
}

.staff-navbar-compact .navbar-header {
  min-height: 24px;
}

/* Compact scores table */
.table-scores {
  width: 100%;
  margin: 0 0 10px;
}

.table-scores > tbody > tr > td {
  padding: 6px 8px;
  vertical-align: middle;
  border-top: 1px solid #eee;
}

.table-scores > tbody > tr:first-child > td {
  border-top: none;
}

.cat-name {
  font-weight: 600;
}

/* Muted panel header */
.dashboard-card.panel-primary > .panel-heading {
  background: #2f6f9f;
  border-color: #2f6f9f;
}

/* Score summary styling */
.score-summary {
  background: #f8f9fa;
  border-radius: 4px;
  padding: 10px;
  margin-bottom: 10px;
}

.score-summary .score-value {
  font-size: 24px;
  font-weight: 700;
  color: #333;
}

.score-summary .score-label {
  font-size: 11px;
  color: #777;
  text-transform: uppercase;
}

/* Categories collapse toggle */
.categories-toggle {
  cursor: pointer;
  color: #337ab7;
  font-size: 12px;
}

.categories-toggle:hover {
  text-decoration: underline;
}

/* Dropdown item as link style */
.dropdown-item-link {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333;
  white-space: nowrap;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
}

.dropdown-item-link:hover,
.dropdown-item-link:focus {
  color: #262626;
  text-decoration: none;
  background-color: #f5f5f5;
}

/* Dashboard score summary in header */
.dashboard-score-summary {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: center;
  vertical-align: middle;
}

.dashboard-score-summary .label {
  font-size: 13px;
  padding: 5px 10px;
  font-weight: 700;
  color: #333;
}

/* Dashboard header row */
.dashboard-header-row {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: flex-end;
  align-items: center;
}

/* Dashboard payment summary */
.dashboard-payment-summary {
  margin-top: 5px;
  display: block;
}

.dashboard-payment-summary-inline {
  /*display: flex;*/
  flex-wrap: wrap;
  gap: 5px;
  justify-content: flex-end;
}

.dashboard-payment-summary-inline .label {
  font-size: 10px;
  padding: 3px 6px;
  font-weight: 500;
}

.dashboard-payment-summary-inline .label i {
  font-size: 9px;
}

.dashboard-payment-summary-stacked {
  text-align: right;
  font-size: 11px;
}

.dashboard-payment-summary-stacked .payment-item {
  margin-bottom: 2px;
}

.dashboard-payment-summary-stacked .payment-label {
  color: #888;
  margin-right: 5px;
}

.dashboard-payment-summary-stacked .payment-value {
  font-weight: 600;
}

/* MIPS-5241: flex row + sticky sidebar, only on md+ screens */
@media (min-width: 992px) {
  .row-flex-sticky {
    display: flex;
  }
  .row-flex-sticky > .col-md-4 > .cart_full {
    position: sticky;
    top: 55px;
  }
}

/* MIPS-5782: Ticket Status page (apache-only, live-pull from Jira).
   Width override for the global .table { width: auto } rule so the table
   fills the panel-body. Scoped class — does not affect other tables. */
.ticket-status-table {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}
.ticket-status-sortable {
  cursor: pointer;
  user-select: none;
}
.ticket-status-toolbar {
  margin-bottom: 10px;
}
.ticket-status-titlebar {
  margin-bottom: 10px;
}
.ticket-status-add-panel {
  margin-bottom: 15px;
}
.ticket-status-page-info {
  display: block;
  margin-top: 4px;
}
/* Task Summary popup body (MIPS-5929) — preserve the comment's line breaks.
   Text fills the modal width; break long tokens so they don't overflow
   (MIPS-6406). */
.ticket-status-task-summary {
  white-space: pre-wrap;
  overflow-wrap: break-word;
}
/* Task Summary popup embedded images (MIPS-6092) — grouped below the text. */
.ticket-status-task-summary-images {
  margin-top: 12px;
}
/* Image fills the modal width so it matches the text width instead of sitting
   small on the left (MIPS-6406). Click opens the full-size lightbox. */
.ticket-status-task-summary-image {
  display: block;
  width: 100%;
  height: auto;
  margin: 8px 0;
  border: 1px solid #ddd;
  cursor: zoom-in;
}
/* Full-size overlay when a Task Summary image is clicked (MIPS-6092 follow-up).
   Click anywhere on the overlay to close. */
.ticket-status-task-summary-lightbox {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 20000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(0, 0, 0, 0.8);
  cursor: zoom-out;
}
.ticket-status-task-summary-lightbox img {
  max-width: 95vw;
  max-height: 95vh;
  box-shadow: 0 0 24px rgba(0, 0, 0, 0.6);
}
/* Customer-feedback marker badge in the Summary cell (MIPS-6091). BS3 danger
   tones so it reads as "needs attention" without colliding with the row
   warning/success backgrounds reserved for Deploying/Done. */
.ticket-status-customer-badge {
  display: inline-block;
  margin-right: 6px;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 600;
  color: #a94442;
  background-color: #f2dede;
  white-space: nowrap;
}
/* Q column — the AI triage questions button (MIPS-7442).
   Every row carries the button, in one of four states, so the column reads the
   same the whole way down: red = questions awaiting an answer, green = answered,
   blue = answered with the ticket moved on (read-only), grey = no triage
   questions. The colours come from the palette already on this page — the
   customer badge's red and the status pills' green and blue. */
.ticket-status-triage-cell {
  width: 28px;
  text-align: center;
}
.ticket-status-triage-btn {
  display: inline-block;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 3px;
  font-size: 12px;
  font-weight: 700;
  line-height: 20px;
  text-align: center;
  /* The three clickable states hover as clickable, matching .click-me elsewhere
     on this page. The grey rule below sets its own cursor. */
  cursor: pointer;
}
.ticket-status-triage-btn-red {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
}
.ticket-status-triage-btn-green {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}
.ticket-status-triage-btn-blue {
  color: #31708f;
  background-color: #d9edf7;
  border-color: #bce8f1;
}
/* Grey renders as a <span> rather than a <button>, so it reads as a marker: it
   stays out of the tab order and carries a default cursor. */
.ticket-status-triage-btn-grey {
  color: #999999;
  background-color: #f5f5f5;
  border-color: #e3e3e3;
  cursor: default;
}
.ticket-status-triage-item {
  margin-bottom: 14px;
}
.ticket-status-triage-question {
  margin-bottom: 4px;
}
.ticket-status-triage-answer-read {
  padding: 4px 8px;
  background-color: #f5f5f5;
  border-radius: 3px;
  white-space: pre-wrap;
}
.ticket-status-triage-chain {
  display: block;
  margin-top: 2px;
}
.ticket-status-triage-actions {
  margin-top: 10px;
}
/* Reporter / Developer avatar (MIPS-7218). Fixed px rather than em so the two
   columns line up whatever the surrounding table font is; vertical-align keeps
   the picture on the name's line instead of pushing the row taller. */
.ticket-status-avatar {
  width: 20px;
  height: 20px;
  margin-right: 6px;
  border-radius: 50%;
  vertical-align: middle;
}

/* Status pill + row tint (MIPS-7219). The status was readable only by finding the
   Status column and reading the word in it: rowClass() shades a row only for the
   three Done-derived states, so every other status looked the same.

   Two surfaces driven by one key (TicketStatus.helpers statusKey): a coloured pill
   on the word, and a tint across the whole row. Every key defined below has BOTH,
   `other` included — a key with a pill and no tint would leave exactly the rows
   this ticket is about with no cue. */
/* Active-sprint marker on the Target Date (MIPS-5928, reworked by MIPS-7219).
   Was an orange cell background; that competed with the status row tint, so the
   marker is now on the date text — weight and an icon, no background of its own,
   so it reads the same on any of the seven row colours. */
.ticket-status-eta-active {
  font-weight: 700;
  white-space: nowrap;
}
.ticket-status-eta-active .bi {
  margin-right: 3px;
  opacity: 0.75;
}

.ticket-status-pill {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  white-space: nowrap;
}
/* The Done pill wraps the Task Summary trigger (an <a class="click-me">), so the
   anchor inherits the pill's colour instead of the default link blue. */
.ticket-status-pill a {
  color: inherit;
  text-decoration: none;
}
.ticket-status-pill a:hover {
  text-decoration: underline;
}

.ticket-status-pill-to-do       { color: #4a5056; background-color: #e4e7ea; }
.ticket-status-pill-triage      { color: #5b3a9e; background-color: #ece2fa; }
.ticket-status-pill-in-progress { color: #1c5d99; background-color: #d6e9f8; }
.ticket-status-pill-stand-by    { color: #8a6d3b; background-color: #fcf3d6; }
.ticket-status-pill-done        { color: #2f6b32; background-color: #d8efd6; }
.ticket-status-pill-deploying   { color: #96501a; background-color: #ffe2c4; }
.ticket-status-pill-unknown     { color: #4a4a4a; background-color: #dcdcdc; }
.ticket-status-pill-discovery          { color: #2a6f8a; background-color: #e3f1f6; }
.ticket-status-pill-impact             { color: #9c3f6d; background-color: #fbe9f1; }
.ticket-status-pill-delivery           { color: #3f4fa0; background-color: #e6e9f9; }
.ticket-status-pill-ready-for-delivery { color: #1f7a52; background-color: #e0f2e9; }
.ticket-status-pill-parking-lot        { color: #6b5f4d; background-color: #efeae1; }
.ticket-status-pill-archived           { color: #7a7a7a; background-color: #ededed; }
/* `other` is the only key whose colour says nothing about the status, so it is
   deliberately the flattest of the set — and distinct from to-do, which it used to
   duplicate exactly. */
.ticket-status-pill-other              { color: #5a5a5a; background-color: #f0f0f0; }

/* The whole row, tinted by status. A stripe on td:first-child was too little
   signal to be worth reading, so the colour goes across the row instead.

   Child-combinator depth matches Bootstrap's .table-striped row specificity, so a
   tint wins over the zebra stripe on the rows it applies to.

   Nothing else competes for the row background any more. rowClass() used to put
   Bootstrap's success/warning/info on the <tr>, but no stylesheet this page loads
   defines those for a table row — verified 2026-08-24 across main.css, main_bs5.css
   and production's compiled main_bs5.*.css — so they painted nothing, and
   MIPS-7219 removed the function. The deploy-state distinction they were meant to
   draw now comes from these tints, via statusKey().

   Deliberately pale: the Customer badge sits on top of this and has to stay
   legible. */
.ticket-status-table > tbody > tr.ticket-status-row-to-do > td       { background-color: #f4f5f6; }
.ticket-status-table > tbody > tr.ticket-status-row-triage > td      { background-color: #f6f1fd; }
.ticket-status-table > tbody > tr.ticket-status-row-in-progress > td { background-color: #eaf3fb; }
.ticket-status-table > tbody > tr.ticket-status-row-stand-by > td    { background-color: #fdf8e8; }
.ticket-status-table > tbody > tr.ticket-status-row-done > td        { background-color: #eef7ed; }
.ticket-status-table > tbody > tr.ticket-status-row-deploying > td   { background-color: #fff2e3; }
.ticket-status-table > tbody > tr.ticket-status-row-unknown > td     { background-color: #f0f0f0; }
.ticket-status-table > tbody > tr.ticket-status-row-discovery > td          { background-color: #eef6fa; }
.ticket-status-table > tbody > tr.ticket-status-row-impact > td             { background-color: #fdf0f5; }
.ticket-status-table > tbody > tr.ticket-status-row-delivery > td           { background-color: #eef0fb; }
.ticket-status-table > tbody > tr.ticket-status-row-ready-for-delivery > td { background-color: #eaf6f0; }
.ticket-status-table > tbody > tr.ticket-status-row-parking-lot > td        { background-color: #f5f2ed; }
.ticket-status-table > tbody > tr.ticket-status-row-archived > td           { background-color: #f7f7f7; }
.ticket-status-table > tbody > tr.ticket-status-row-other > td              { background-color: #fafafa; }


/* AIChat bubbles (used by reactJSX/components/AIChat). Colors mirror BS3
   @brand-primary and @well-bg / @well-border so they track the theme. */
.ai-chat-bubble {
  display: inline-block;
  max-width: 75%;
  margin: 0 0 6px;
  padding: 8px 14px;
  word-wrap: break-word;
  white-space: pre-wrap;
  text-align: left;
  vertical-align: top;
}
.ai-chat-bubble--user {
  background-color: #337ab7;
  color: #fff;
  border-radius: 16px 16px 4px 16px;
}
.ai-chat-bubble--ai {
  background-color: #f5f5f5;
  color: #333;
  border: 1px solid #e3e3e3;
  border-radius: 16px 16px 16px 4px;
}

.dashboard-ai-split {
  position: relative;
}

.dashboard-ai-split__main {
  min-width: 0;
}

.dashboard-ai-split__drawer {
  min-width: 0;
  background: #fff;
}

.dashboard-ai-split__drawer--closed {
  display: none;
}

.dashboard-ai-split__drawer-toolbar {
  display: none;
}

.dashboard-ai-chat {
  min-width: 0;
}

.dashboard-ai-chat-wrap--drawer,
.dashboard-ai-chat--drawer {
  height: 100%;
}

.dashboard-ai-chat--drawer {
  display: flex;
  flex-direction: column;
  margin-top: 0;
}

.dashboard-ai-chat--drawer .panel-heading {
  flex: 0 0 auto;
}

.dashboard-ai-chat__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
  padding: 12px;
}

.dashboard-ai-chat__body > .text-muted {
  margin-bottom: 0;
}

.dashboard-ai-chat__thread {
  flex: 1 1 auto;
  min-height: 240px;
  max-height: calc(100vh - 320px);
  margin-bottom: 0;
  padding-right: 4px;
}

.dashboard-ai-chat__composer {
  flex: 0 0 auto;
  margin-top: 0;
  margin-bottom: 0;
}

.dashboard-ai-chat__composer .form-control {
  min-height: 88px;
  resize: vertical;
}

@media (min-width: 992px) {
  .dashboard-ai-split--open {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(320px, 20vw, 420px);
    gap: 16px;
    align-items: start;
  }

  .dashboard-ai-split--open .dashboard-ai-split__drawer {
    position: sticky;
    top: 20px;
  }
}

@media (max-width: 991px) {
  .dashboard-ai-split__drawer--mobile-overlay.dashboard-ai-split__drawer--open {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100vw;
    max-width: 100vw;
    padding: 16px;
    overflow-y: auto;
    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.18);
    z-index: 1035;
  }

  .dashboard-ai-split__drawer--mobile-overlay:focus {
    outline: none;
  }

  .dashboard-ai-split__drawer-toolbar {
    display: block;
  }

  .dashboard-ai-chat__thread {
    max-height: none;
    min-height: 200px;
  }
}

.knowledge-upload-modal__overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.2);
  z-index: 9000;
}

.knowledge-upload-modal__content {
  position: absolute;
  top: 45%;
  left: 50%;
  right: auto;
  bottom: auto;
  margin-right: -50%;
  transform: translate(-50%, -45%);
  padding: 0;
  width: 90vw;
  max-width: 1100px;
  max-height: 90vh;
  border: 0;
  overflow: hidden;
}

.knowledge-upload-modal__panel {
  border-width: 0;
}

.knowledge-upload-modal__console {
  min-height: 320px;
  max-height: 55vh;
}

/* ==========================================================================
   MIPS-5468 — AI Tickets Monitor page. Every rule is scoped under
   .ai-tickets-monitor-page. Do NOT scope under .ticket-status-page — that
   class is shared with the Ticket Status page (TicketStatus.jsx), so rules
   scoped there would leak onto it.
   ========================================================================== */
.ai-tickets-monitor-page .ai-monitor-titlebar {
  margin-bottom: 10px;
}
.ai-tickets-monitor-page .ai-monitor-tabpanel-hidden {
  display: none;
}

/* MIPS-5468 metric-led hero header (replaces the old four-card summary strip).
   Palette: #fff on a 1px #ddd border, matching the page's other panels. The
   mockup's design tokens (var(--surface-2), var(--radius), var(--font-mono)) do not
   exist here, so they are translated to hardcoded hex and an inline monospace stack. */
.ai-tickets-monitor-page .ai-monitor-hero {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 1.25rem;
  margin-bottom: 12px;
}
/* MIPS-5468 hero top row: five columns in reading order — Unassigned queue, its
   created-vs-PRs chart, Est. total cost, its spend sparkline, then all-runs. Each
   chart sits BESIDE the metric it explains rather than under it, so the row reads
   metric-chart-metric-chart-chart on one line when there is width.
   flex-wrap keeps it honest on narrow viewports: the columns fold to a second row
   rather than crushing the charts.
   align-items is flex-START, not flex-end: the columns have genuinely different
   content heights (metric+bar, chart+legend, metric only), so bottom-aligning them
   started every column's title and chart at a different y — the misalignment this
   panel was reported for. Top-aligning is only half the fix; the shared head/body
   bands at the end of this block are what actually hold the grid. */
.ai-tickets-monitor-page .ai-monitor-hero-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}
/* The three chart columns share one sizing rule so none of them can quietly grow at
   another's expense. min-width is what forces the wrap instead of a squeezed chart. */
.ai-tickets-monitor-page .ai-monitor-hero-col {
  flex: 1 1 200px;
  min-width: 170px;
  max-width: 340px;
}
.ai-tickets-monitor-page .ai-monitor-hero-label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ai-tickets-monitor-page .ai-monitor-hero-metric {
  font-size: 44px;
  line-height: 1.1;
  font-weight: bold;
  color: #c77f0a;
}
.ai-tickets-monitor-page .ai-monitor-hero-sub {
  font-size: 13px;
  margin-top: 4px;
}
/* Est. total cost — a secondary headline metric sitting between the queue and the
   runs chart; smaller than the queue metric and a distinct informational blue. */
.ai-tickets-monitor-page .ai-monitor-hero-cost {
  min-width: 150px;
}
.ai-tickets-monitor-page .ai-monitor-hero-cost-metric {
  font-size: 30px;
  line-height: 1.1;
  font-weight: bold;
  color: #337ab7;
}
/* Share-of-view bar under the primary metric: slim, capped so it does not stretch
   the full panel width. */
.ai-tickets-monitor-page .ai-monitor-hero-progress {
  height: 6px;
  max-width: 260px;
  margin: 8px 0 0;
  border-radius: 3px;
}
/* Chart column head — the title line, plus the runs column's "peak N" readout.
   Sizing comes from the shared .ai-monitor-hero-col rule above — this column carries
   both classes, and duplicating flex/min-width/max-width here would silently win on
   source order and let one chart drift wider than its siblings.
   Same reasoning vertically: this head's height and bottom margin come from the shared
   head-band rule at the end of this block, so it cannot drift off the line its sibling
   columns' heads sit on. */
.ai-tickets-monitor-page .ai-monitor-hero-chart-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}
.ai-tickets-monitor-page .ai-monitor-hero-chart-label {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
/* Empty-window stand-in. It is one of the shared chart-body band members below, so an
   empty column occupies exactly the same band as a drawn one and nothing shifts. */
.ai-tickets-monitor-page .ai-monitor-hero-chart-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border: 1px dashed #ddd;
  border-radius: 6px;
  text-align: center;
}
/* Secondary counts: five cells divided by left borders. */
.ai-tickets-monitor-page .ai-monitor-hero-secondary {
  display: flex;
  flex-wrap: wrap;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #ddd;
}
.ai-tickets-monitor-page .ai-monitor-hero-cell {
  flex: 1 1 0;
  min-width: 90px;
  padding: 0 16px;
  border-left: 1px solid #ddd;
}
.ai-tickets-monitor-page .ai-monitor-hero-cell:first-child {
  padding-left: 0;
  border-left: 0;
}
.ai-tickets-monitor-page .ai-monitor-hero-cell-value {
  display: block;
  font-size: 22px;
  font-weight: bold;
}
.ai-tickets-monitor-page .ai-monitor-hero-cell-label {
  display: block;
  font-size: 12px;
}
/* MIPS-5468 — all three hero charts (mirrored open-vs-done, est. spend per day, runs
   per day) are RECHARTS charts, per reactJSX/CLAUDE.md: one charting idiom for the whole
   panel. Their series colours, the ReferenceLine baseline and the peak-day highlight are
   Recharts props in AiTicketsHero.jsx, because a series colour is data-bound and cannot
   be expressed here.
   That leaves the three chart bodies (.ai-monitor-hero-mirror, -bars, -costline) needing
   nothing from CSS but the shared 64px chart-body band declared at the end of this block
   — which is why they have no individual rules: Recharts sizes its own wrapper divs from
   the ResponsiveContainer height, and a second height here would either be dead or, if it
   landed below the band, silently win on source order and un-align that one column.
   The mirrored chart's key below is NOT a Recharts <Legend>: a legend would eat most of
   the 64px band. It names each swatch in one word ("done", "open") because colour alone
   cannot say which series is which for a colour-blind viewer or a greyscale print. It is
   what stops the chart depending on colour alone. */
.ai-tickets-monitor-page .ai-monitor-hero-mirror-key {
  margin-top: 4px;
}
.ai-tickets-monitor-page .ai-monitor-hero-mirror-swatch {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  vertical-align: baseline;
}
.ai-tickets-monitor-page .ai-monitor-hero-mirror-swatch.is-created {
  background-color: #ec971f;
}
.ai-tickets-monitor-page .ai-monitor-hero-mirror-swatch.is-prs {
  background-color: #4cae4c;
}
/* MIPS-5468 hero alignment grid — the two shared horizontal bands every column of
   .ai-monitor-hero-top opens with, and the reason the row's titles and charts read as
   one level instead of five.
   align-items alone cannot do this: the five columns hold different content (44px
   metric + progress bar, diverging bar chart + text key, 30px metric, line chart, bar
   chart), so ANY single align-items value leaves their internal rows at different y.
   Fixed bands do not care what the content is:
     band 1 — 18px head: the column's LABEL (metric columns) or CHART-HEAD (chart
              columns). All three chart titles therefore start at the row's top edge.
     band 2 — 64px body: the column's headline FIGURE or its CHART. All three plot
              areas therefore start at the same y AND are the same height, so the
              three chart bodies read as one band. The three chart bodies are plain
              boxes here and Recharts fills them from the inside, so the number passed
              to each ResponsiveContainer (CHART_BODY_HEIGHT in AiTicketsHero.jsx) MUST
              stay equal to the 64px below.
   Declared LAST in the hero block on purpose: the two headline figures and the
   placeholder also have their own rules above for colour/display, and the band must win
   the height regardless of what those say.
   Bands travel with the column, so a wrapped row still aligns within itself and
   flex-wrap keeps working untouched. Deliberately NOT css grid on the row: grid would
   mean giving up flex-wrap, which is the narrow-viewport behaviour this panel needs. */
.ai-tickets-monitor-page .ai-monitor-hero-chart-head,
.ai-tickets-monitor-page .ai-monitor-hero-label {
  height: 18px;
  line-height: 18px;
  margin: 0 0 6px;
}
.ai-tickets-monitor-page .ai-monitor-hero-mirror,
.ai-tickets-monitor-page .ai-monitor-hero-bars,
.ai-tickets-monitor-page .ai-monitor-hero-costline,
.ai-tickets-monitor-page .ai-monitor-hero-chart-placeholder,
.ai-tickets-monitor-page .ai-monitor-hero-metric,
.ai-tickets-monitor-page .ai-monitor-hero-cost-metric {
  height: 64px;
  margin-top: 0;
}
/* Both headline figures sit on the body band's BOTTOM edge — which is also where the
   two bar charts' baseline sits — so a 44px figure, a 30px figure and three charts of
   different natural heights all read off one line. */
.ai-tickets-monitor-page .ai-monitor-hero-metric,
.ai-tickets-monitor-page .ai-monitor-hero-cost-metric {
  display: flex;
  align-items: flex-end;
}

/* MIPS-5468 Queue tab card. Same surface/border/radius idiom as .ai-monitor-hero
   above (#fff on 1px #ddd, 12px radius) so the queue reads as a native panel on the
   page. No design-system custom properties exist here — colours are the page's
   hardcoded hexes (info blue #337ab7, success green #3c763d), matching the hero and
   the live dot. overflow:hidden so the header strip and row borders stay inside the
   rounded corner. */
.ai-tickets-monitor-page .ai-queue-card {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 12px;
  overflow: hidden;
}
/* Header strip: title + count on the left, the muted drag hint on the right. */
.ai-tickets-monitor-page .ai-queue-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: 10px 14px;
  background-color: #f9f9f9;
  border-bottom: 1px solid #eee;
}
.ai-tickets-monitor-page .ai-queue-head-title {
  font-weight: bold;
}
.ai-tickets-monitor-page .ai-queue-count {
  color: #999;
  font-weight: normal;
}
.ai-tickets-monitor-page .ai-queue-hint {
  font-size: 12px;
}
/* Row list — no bullets, flush against the card edges. */
.ai-tickets-monitor-page .ai-queue-list {
  margin: 0;
}
.ai-tickets-monitor-page .ai-queue-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  border-top: 1px solid #f0f0f0;
  cursor: grab;
}
/* The list opens flush under the header strip, so the first row's own top border
   would double the header's bottom border. */
.ai-tickets-monitor-page .ai-queue-row:first-child {
  border-top: 0;
}
.ai-tickets-monitor-page .ai-queue-row:hover {
  background-color: #f9f9f9;
}
/* @hello-pangea/dnd sets position/transform inline while dragging; this only adds
   the lift affordance so the picked-up row reads as detached from the list. */
.ai-tickets-monitor-page .ai-queue-row.dragging,
.ai-tickets-monitor-page .ai-queue-row[data-rbd-draggable-context-id][style*="position: fixed"] {
  background-color: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
/* Grip handle — muted, grab cursor, darker + visibly focusable for keyboard drag. */
.ai-tickets-monitor-page .ai-queue-handle {
  color: #bbb;
  cursor: grab;
}
.ai-tickets-monitor-page .ai-queue-handle:hover {
  color: #777;
}
.ai-tickets-monitor-page .ai-queue-handle:focus {
  color: #337ab7;
  outline: 2px solid #337ab7;
  outline-offset: 2px;
}
/* Position number — fixed narrow column so the keys still line up. */
.ai-tickets-monitor-page .ai-queue-num {
  min-width: 18px;
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  font-size: 12px;
  color: #999;
  text-align: right;
}
/* "next up" pill on the first row only — the info-blue accent from the hero. */
.ai-tickets-monitor-page .ai-queue-nextup {
  padding: 1px 7px;
  border-radius: 10px;
  background-color: #d9edf7;
  color: #31708f;
  font-size: 11px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.ai-tickets-monitor-page .ai-queue-key {
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  color: #333;
}
.ai-tickets-monitor-page .ai-queue-when {
  font-size: 12px;
}
/* Remove — subtle by default, revealed on row hover AND on the button's own focus so
   it stays keyboard/touch reachable (not hover-only). margin-left:auto pins it right. */
.ai-tickets-monitor-page .ai-queue-remove {
  margin-left: auto;
  padding: 0 4px;
  color: #a94442;
  opacity: 0;
}
.ai-tickets-monitor-page .ai-queue-row:hover .ai-queue-remove,
.ai-tickets-monitor-page .ai-queue-remove:focus {
  opacity: 1;
}
/* Claimed section — divided from the queued list by a top border, its own header. */
.ai-tickets-monitor-page .ai-queue-claimed {
  border-top: 1px solid #ddd;
}
.ai-tickets-monitor-page .ai-queue-claimed-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  border-top: 1px solid #f0f0f0;
}
.ai-tickets-monitor-page .ai-queue-claimed-row:first-child {
  border-top: 0;
}
/* Avatar circle — reuses the mdi-avatar-N palette classes for the fill/text colour;
   this rule owns only the shape and sizing. */
.ai-tickets-monitor-page .ai-queue-avatar {
  display: inline-block;
  width: 22px;
  height: 22px;
  line-height: 22px;
  border-radius: 50%;
  font-size: 10px;
  font-weight: bold;
  text-align: center;
  background-color: #eceff1;
  color: #455a64;
}
/* Running badge — the success green already used by the live dot. */
.ai-tickets-monitor-page .ai-queue-running {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 1px 8px;
  border-radius: 10px;
  background-color: #dff0d8;
  color: #3c763d;
  font-size: 11px;
  font-weight: bold;
}

/* MIPS-5468 tab bar. The live dot pulses only when a worker is actually
   solving. main.css has no other prefers-reduced-motion block — this is the
   first; keep the animation inside no-preference so `reduce` gets nothing. */
.ai-tickets-monitor-page .ai-monitor-tabs {
  margin-bottom: 15px;
}
/* Scoped to :not(.active) on purpose. BS3's `.nav-tabs > li.active > a`
   (main.css:11969) sets `cursor: default` at the same specificity (0,2,2) but
   earlier in the file, so an unscoped rule here would silently win and make the
   already-selected tab look clickable. */
.ai-tickets-monitor-page .ai-monitor-tabs > li:not(.active) > a {
  cursor: pointer;
}
.ai-tickets-monitor-page .ai-monitor-tab-badge {
  margin-left: 4px;
}
.ai-tickets-monitor-page .ai-monitor-live-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 4px;
  border-radius: 50%;
  background-color: #3c763d;
  vertical-align: middle;
}
@media (prefers-reduced-motion: no-preference) {
  .ai-tickets-monitor-page .ai-monitor-tab-badge-live .ai-monitor-live-dot {
    animation: ai-monitor-pulse 1.6s ease-in-out infinite;
  }
}
@keyframes ai-monitor-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.35; }
}

/* MIPS-5468 stale marker, shared by the hero header's primary metric. */
.ai-tickets-monitor-page .ai-monitor-stale-flag {
  margin-left: 6px;
}

/* MIPS-5468 our own filter row, above BTTable's. It carries the needs-info toggle
   and a focusable Clear all — BTTable's own Clear button disappears when a
   parent-side filter is the only active one, and is a non-focusable <a>. */
.ai-tickets-monitor-page .ai-tickets-filter-row {
  padding: 8px 10px;
  margin-bottom: 8px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
}
/* Self-contained clearfix: Clear all is floated (.pull-right, in
   bootstrap3-compat.css, with !important) and NO .clearfix rule reaches the staff
   shell — neither main.css nor bootstrap3-compat.css declares one, and the rules in
   mdicom.css are only linked from the public login/reset templates. Without this the
   button escapes the bordered row and the grey box collapses to the height of the
   checkbox label beside it. */
.ai-tickets-monitor-page .ai-tickets-filter-row::after {
  content: '';
  display: table;
  clear: both;
}

/* MIPS-5468 type tag + severity chip. Severity is lower-case in the data; display
   it capitalised without changing the value the chip's text node carries. */
.ai-tickets-monitor-page .ai-type-tag {
  white-space: nowrap;
}
.ai-tickets-monitor-page .ai-severity-chip {
  text-transform: capitalize;
}

/* MIPS-5468 assignee avatars. Eight fixed slots picked by a deterministic hash of
   the display name, so one person keeps one colour across the page. Not scoped to
   the page class: `mdi-avatar` is deliberately a reusable primitive. */
.mdi-avatar {
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  border-radius: 50%;
  font-size: 10px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}
.mdi-avatar-1 { background-color: #d9edf7; color: #31708f; }
.mdi-avatar-2 { background-color: #dff0d8; color: #3c763d; }
.mdi-avatar-3 { background-color: #fcf8e3; color: #8a6d3b; }
.mdi-avatar-4 { background-color: #f2dede; color: #a94442; }
.mdi-avatar-5 { background-color: #e8e3f5; color: #5b4b8a; }
.mdi-avatar-6 { background-color: #e0f2f1; color: #00695c; }
.mdi-avatar-7 { background-color: #fde9e0; color: #a0522d; }
.mdi-avatar-8 { background-color: #eceff1; color: #455a64; }

.ai-tickets-monitor-page .ai-avatar-wrap {
  white-space: nowrap;
}
.ai-tickets-monitor-page .ai-unassigned {
  font-style: italic;
}

/* MIPS-5468 two-line summary clamp. -webkit-line-clamp is supported in every
   browser this app targets; the title attribute carries the full text regardless. */
.ai-tickets-monitor-page .ai-summary-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.45;
}
.ai-tickets-monitor-page .ai-needs-info-pill {
  margin-left: 6px;
  text-transform: uppercase;
  font-size: 10px;
}

/* MIPS-5468 ticket row height. MUST equal TICKETS_ROW_HEIGHT in
   AiTicketsMonitor.rows.jsx (84) — AiTicketsMonitor.rows.Unit.jsx reads this rule and
   fails if the two drift. BTTable also stamps the same number inline on each <tr> and
   derives its virtual padding rows from it, so this rule is the stylesheet's own copy
   of the contract; it additionally reaches the rows BTTable does NOT stamp (the
   "No records found" row), keeping an empty table the height of a populated one. */
.ai-tickets-monitor-page .ai-tickets-table-wrap tbody > tr {
  height: 84px;
}

/* MIPS-5468 zebra + hover for the two monitor tables. WRITTEN ON tr, NEVER ON td:
   the stale-row highlight lives on the <td> (buildBtRows puts `warning` in
   cellClassName and BTTable writes it onto every cell), so what paints the amber is
   Bootstrap's `.table > tbody > tr > td.warning`, specificity (0,2,3). A rule such as
   `.ai-tickets-monitor-page table tbody tr.item-odd > td` would be (0,2,4) and would
   silently beat that amber. On the ROW the parity rules are (0,3,2) and the hover rule
   is (0,4,2) — above every row background they have to beat: the app-wide
   `.item-even` / `.item-odd` (0,1,0, main.css:10190/10194), the app-wide
   `.table-hover .item-even:hover, .table-hover .item-odd:hover` (0,3,0,
   main.css:10266-10267) and Bootstrap's own `.table-hover > tbody > tr:hover` (0,2,2,
   www/js/bootstrap-3.4.1-dist/css/bootstrap.css:2432). Confirmed in a real browser.
   And they never touch a cell background, so the amber keeps painting over the stripe
   the way a child background always does.
   The hover rule NAMES THE PARITY CLASSES on purpose, rather than a bare
   `tbody > tr:hover`: BTTable's virtual padding rows (BTTable.jsx:975-980 and :982-986)
   are plain <tr> children of the same tbody and carry no parity class, so a bare
   tr:hover tinted the blank band above/below the virtual window — reachable as soon as
   virtualisation engages (roughly 14+ rows at 84px in the 750px scroll box, overscan
   included), i.e. on exactly the long pages this table exists for.
   It also still sits AFTER the two parity rules. At (0,4,2) it now wins on specificity
   alone, so the order is no longer load-bearing — it is kept so that narrowing the
   selector back to (0,3,2), where tr:hover and tr.item-odd tie, would still work.
   THE AMBER IS ON LOAN FROM A CDN, which is what Task 17's whole premise rests on:
   Bootstrap 3's stylesheet is commented out in modules/common/standard_css.inc:117-118
   and neither main.css nor www/css/bootstrap3-compat.css declares `td.warning`, so
   `.table > tbody > tr > td.warning { background-color: #fcf8e3 }` reaches the page
   ONLY through main.css:8's `@import` of
   //maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css — remove that import
   and the stale-row highlight disappears entirely, leaving these zebra rules as the
   only row backgrounds on the page. */
.ai-tickets-monitor-page .ai-tickets-table-wrap tbody > tr.item-odd,
.ai-tickets-monitor-page .ai-runs-table-wrap tbody > tr.item-odd,
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap tbody > tr.item-odd {
  background-color: #fafbfc;
}
.ai-tickets-monitor-page .ai-tickets-table-wrap tbody > tr.item-even,
.ai-tickets-monitor-page .ai-runs-table-wrap tbody > tr.item-even,
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap tbody > tr.item-even {
  background-color: #ffffff;
}
.ai-tickets-monitor-page .ai-tickets-table-wrap tbody > tr.item-odd:hover,
.ai-tickets-monitor-page .ai-tickets-table-wrap tbody > tr.item-even:hover,
.ai-tickets-monitor-page .ai-runs-table-wrap tbody > tr.item-odd:hover,
.ai-tickets-monitor-page .ai-runs-table-wrap tbody > tr.item-even:hover,
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap tbody > tr.item-odd:hover,
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap tbody > tr.item-even:hover {
  background-color: #eff4ff;
}

/* MIPS-5468 CSS-only empty states. BTTable hardcodes <h3>No records found</h3> and
   has no override prop, so we hide it and paint our own text.
   - Anchor on td[colspan] > h3. NEVER on td.text-center: every data cell has that
     class, so the rule would paint on all of them.
   - font-size:0 rather than color:transparent (pseudo-elements inherit colour) or
     display:none (which removes them). Because font-size is inherited, each
     pseudo-element below has to re-declare one of its own.
   - The two causes carry OPPOSITE advice, so the wrapper's ai-empty-nodata /
     ai-empty-filtered class (set in AiTicketsTable.jsx and AiTicketsRunsTable.jsx) is
     what picks the sentence AND the icon; the shared rules here only lay out the box.
     The ICON is cause-specific for the same reason the sentence is: fa-filter on the
     nodata state contradicted its own advice ("nothing in this window, widen it") by
     showing a funnel when nothing had been filtered — the exact confusion this cause
     discrimination exists to remove. nodata therefore gets fa-file-text-o, which reads
     as "no records here" and matches the "No records found" the screen reader still
     announces; only the filtered state keeps the funnel.
   Known trade-off, accepted at design time: screen readers still announce
   "No records found" while sighted users read the text below. */
.ai-tickets-monitor-page .ai-tickets-table-wrap td[colspan] > h3,
.ai-tickets-monitor-page .ai-runs-table-wrap td[colspan] > h3,
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap td[colspan] > h3 {
  font-size: 0;
}
.ai-tickets-monitor-page .ai-tickets-table-wrap td[colspan] > h3::before,
.ai-tickets-monitor-page .ai-runs-table-wrap td[colspan] > h3::before,
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap td[colspan] > h3::before {
  display: block;
  margin-bottom: 8px;
  font-family: FontAwesome;
  font-size: 22px;
  color: #999;
}
.ai-tickets-monitor-page .ai-tickets-table-wrap.ai-empty-nodata td[colspan] > h3::before,
.ai-tickets-monitor-page .ai-runs-table-wrap.ai-empty-nodata td[colspan] > h3::before,
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap.ai-empty-nodata td[colspan] > h3::before {
  content: "\f0f6"; /* fa-file-text-o — nothing was recorded, nothing was filtered */
}
.ai-tickets-monitor-page .ai-tickets-table-wrap.ai-empty-filtered td[colspan] > h3::before,
.ai-tickets-monitor-page .ai-runs-table-wrap.ai-empty-filtered td[colspan] > h3::before,
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap.ai-empty-filtered td[colspan] > h3::before {
  content: "\f0b0"; /* fa-filter — a filter or the search box is what hid the rows */
}
.ai-tickets-monitor-page .ai-tickets-table-wrap td[colspan] > h3::after,
.ai-tickets-monitor-page .ai-runs-table-wrap td[colspan] > h3::after,
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap td[colspan] > h3::after {
  display: block;
  font-size: 15px;
  color: #777;
}
.ai-tickets-monitor-page .ai-tickets-table-wrap.ai-empty-nodata td[colspan] > h3::after {
  content: "No AI tickets in this window. Try a longer Ticket window.";
}
.ai-tickets-monitor-page .ai-tickets-table-wrap.ai-empty-filtered td[colspan] > h3::after {
  content: "No tickets match these filters. Clear them above.";
}
.ai-tickets-monitor-page .ai-runs-table-wrap.ai-empty-nodata td[colspan] > h3::after {
  content: "No Auto-Solve runs yet.";
}
.ai-tickets-monitor-page .ai-runs-table-wrap.ai-empty-filtered td[colspan] > h3::after {
  content: "No runs match your search.";
}

.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap.ai-empty-nodata td[colspan] > h3::after {
  content: "No AI Jira Triage runs recorded yet.";
}
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap.ai-empty-filtered td[colspan] > h3::after {
  content: "No triage runs match your search.";
}

/* MIPS-5468 AI Jira Triage run rows. Same height contract as the Auto-Solve runs table:
   MUST equal AI_JIRA_TRIAGE_RUNS_ROW_HEIGHT in AiTicketsJiraTriageRuns.rows.jsx (64) —
   AiTicketsJiraTriageRunsRows.Unit.jsx reads this rule and fails if the two drift. */
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap tbody > tr {
  height: 64px;
}

/* MIPS-5468 AI Jira Triage provenance. The cron-vs-manual distinction is the whole point
   of that table — a hand-run --ticket invocation used the operator's OWN filters and must
   not read as a normal cron tick weeks later — so it is carried THREE ways: the chip's
   text, the chip's icon, and this row tint. Never by colour alone.

   The tint is declared HERE rather than borrowed from Bootstrap's `td.info`: as the zebra
   comment above notes, those contextual cell colours reach this page only through the CDN
   @import at main.css:8, so a row cue built on one would vanish with it. #eef4ff is the
   same family as the zebra hover, one step bluer, so a tinted row still reads as a row.
   The left border is what survives if the background is ever overridden by a hover. */
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap td.ai-triage-manual-cell {
  background-color: #eef4ff;
}
.ai-tickets-monitor-page .ai-jira-triage-runs-table-wrap td.ai-triage-manual-cell:first-child {
  border-left: 3px solid #337ab7;
}
.ai-tickets-monitor-page .ai-triage-source-chip {
  white-space: nowrap;
}
/* The failure token is monospace for the same reason the node id is: you compare it
   against, or grep the worker log for, the exact string. */
.ai-tickets-monitor-page .ai-triage-failure-token {
  font-family: Menlo, Consolas, monospace;
  font-size: 11px;
}
/* A spent strike is the consequential reading in that column, so it is the one that is
   emphasised; the "Not counted" rows stay muted (text-muted, from Bootstrap). */
.ai-tickets-monitor-page .ai-triage-strike-counted {
  font-weight: 600;
  color: #a94442;
}
/* The panel's standing note about Manual rows. Sits directly under the sr-only heading and
   above the table, so it is read before the rows it explains. */
.ai-tickets-monitor-page .ai-jira-triage-runs-note {
  margin-bottom: 10px;
}

/* MIPS-5468 Auto-Solve run cells. The node id is monospace because you compare it
   against a hostname; the outcome chip carries an icon next to its colour and must
   keep the two on one line. */
.ai-tickets-monitor-page .ai-outcome-chip {
  white-space: nowrap;
}
.ai-tickets-monitor-page .ai-run-node {
  font-family: Menlo, Consolas, monospace;
  font-size: 11px;
}

/* MIPS-5468 run row height. MUST equal AI_RUNS_ROW_HEIGHT in AiTicketsRuns.rows.jsx
   (64) — AiTicketsRunsRows.Unit.jsx reads this rule and fails if the two drift.
   BTTable stamps the same number inline on each <tr> and derives its virtual padding
   rows from it, so this rule is the stylesheet's own copy of the contract; it
   additionally reaches the rows BTTable does NOT stamp (the "No records found" row),
   which is what keeps an empty runs table the height of a populated one. */
.ai-tickets-monitor-page .ai-runs-table-wrap tbody > tr {
  height: 64px;
}

/* MIPS-5468 worker cards. The card is a plain panel; the selection control inside it
   is a real <button> (keyboard-operable) stripped back so the CARD reads as the
   clickable surface. The activity line is the card's footer, outside that button,
   because a <button> may not contain the Jira link. The selected cue is a wider left
   border plus a check glyph, not colour — the card is already colour-coded by state. */
.ai-tickets-monitor-page .ai-worker-grid {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  grid-gap: 12px;
  margin-bottom: 16px;
}
/* No display/width here: the card is a GRID ITEM, so it is blockified and stretched to
   its track by the grid — measured identical at 360-1920px with and without both
   declarations. They are left over from when the card itself was a <button>. */
.ai-tickets-monitor-page .ai-worker-card {
  text-align: left;
  padding: 12px 14px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-left-width: 4px;
  border-radius: 4px;
}
.ai-tickets-monitor-page .ai-worker-card-btn {
  display: block;
  width: 100%;
  padding: 0;
  /* A button centres its text, paints its own chrome and shows the default arrow
     cursor — all three would read as a control inside a card rather than as the card
     itself being clickable. */
  text-align: left;
  color: inherit;
  font: inherit;
  background: none;
  border: 0;
  cursor: pointer;
}
/* The reset above strips the button's border AND background, which is exactly what a UA
   focus ring is drawn from in some browsers — and the card is the only way to select a
   node by keyboard. An explicit ring, so no future `outline: 0` can make the focused card
   indistinguishable from its neighbours. Offset outwards: the card's own 4px state stripe
   sits on the parent, and a flush ring would read as part of it. */
.ai-tickets-monitor-page .ai-worker-card-btn:focus,
.ai-tickets-monitor-page .ai-worker-card-btn:focus-visible {
  outline: 2px solid #66afe9;
  outline-offset: 2px;
}
.ai-tickets-monitor-page .ai-worker-card-working  { border-left-color: #3c763d; }
.ai-tickets-monitor-page .ai-worker-card-idle     { border-left-color: #ccc; }
.ai-tickets-monitor-page .ai-worker-card-stale    { border-left-color: #8a6d3b; }
.ai-tickets-monitor-page .ai-worker-card-offline  { border-left-color: #a94442; }
.ai-tickets-monitor-page .ai-worker-card-unknown  { border-left-color: #999; }
.ai-tickets-monitor-page .ai-worker-card-selected {
  border-color: #66afe9;
  border-left-width: 6px;
}
.ai-tickets-monitor-page .ai-worker-card-head {
  display: block;
  margin-bottom: 2px;
}
.ai-tickets-monitor-page .ai-worker-card-id {
  font-weight: bold;
  word-break: break-all;
}
.ai-tickets-monitor-page .ai-worker-card-state {
  float: right;
}
/* MIPS-7536: the fleet-level deploy warning, above the pills. Spacing only — the
   colour comes from Bootstrap's alert-warning, same as the capped notice. */
.ai-tickets-monitor-page .ai-worker-deploy-notice {
  margin-bottom: 8px;
}
/* MIPS-7536: the deploy chip sits beside the state chip, never replacing it — one
   answers liveness, the other currency, and a worker can be Working on stale code.
   Floated like its sibling so it lands left of it (DOM order fills right to left). */
.ai-tickets-monitor-page .ai-worker-card-deploy {
  float: right;
  margin-right: 4px;
}
.ai-tickets-monitor-page .ai-worker-card-role,
.ai-tickets-monitor-page .ai-worker-card-activity,
.ai-tickets-monitor-page .ai-worker-card-cfg,
.ai-tickets-monitor-page .ai-worker-card-seen {
  display: block;
  clear: both;
}
.ai-tickets-monitor-page .ai-worker-card-activity {
  margin: 8px 0 0;
  padding-top: 8px;
  border-top: 1px solid #eee;
}
.ai-tickets-monitor-page .ai-worker-cfg-pill {
  display: inline-block;
  margin: 0 4px 4px 0;
  padding: 1px 7px;
  font-size: 11px;
  font-family: Menlo, Consolas, monospace;
  color: #555;
  background-color: #f0f0f0;
  border-radius: 9px;
}
.ai-tickets-monitor-page .ai-fleet-pills {
  margin-bottom: 12px;
}
.ai-tickets-monitor-page .ai-fleet-pill {
  margin-right: 6px;
}

/* MIPS-5468 run-log panel. Dark terminal treatment, monospace body, capped height
   with its own scroll — this is our own component, so an inner scroller here is a
   deliberate choice rather than a fight with BTTable. */
.ai-tickets-monitor-page .ai-run-log-panel {
  background-color: #0e1420;
  border: 1px solid #1c2635;
  border-radius: 4px;
  padding: 10px 12px;
  color: #d6dee9;
}
.ai-tickets-monitor-page .ai-run-log-head {
  padding-bottom: 8px;
  border-bottom: 1px solid #1c2635;
  margin-bottom: 8px;
}
.ai-tickets-monitor-page .ai-run-log-title {
  font-weight: bold;
}
/* The node id and the transcript are monospace for the same reason the runs table's
   node cell is: you compare them against a hostname and against each other. Declared
   per selector rather than as a group so each rule can be read on its own. */
.ai-tickets-monitor-page .ai-run-log-node {
  font-family: Menlo, Consolas, monospace;
  font-size: 12px;
  color: #6b7b8f;
}
.ai-tickets-monitor-page .ai-run-log-outcome {
  margin-left: 6px;
}
.ai-tickets-monitor-page .ai-run-log-status {
  min-height: 0;
  font-size: 11px;
  color: #6b7b8f;
}
.ai-tickets-monitor-page .ai-run-log-note {
  margin: 6px 0;
  font-size: 12px;
  color: #6b7b8f;
}
.ai-tickets-monitor-page .ai-run-log-note-warn {
  color: #e8b85b;
}
.ai-tickets-monitor-page .ai-run-log-body {
  font-family: Menlo, Consolas, monospace;
  font-size: 12px;
  max-height: 300px;
  overflow-y: auto;
  line-height: 1.7;
}
.ai-tickets-monitor-page .ai-run-log-ts {
  color: #6b7b8f;
}
.ai-tickets-monitor-page .ai-run-log-label {
  color: #6ea8ff;
  font-weight: bold;
}
.ai-tickets-monitor-page .ai-run-log-foot {
  padding-top: 8px;
  border-top: 1px solid #1c2635;
  margin-top: 8px;
}

/* ---------------------------------------------------------------------------
   File Storage browser (MIPS-6438)
   The React replacement for modules/file_storage/interface.phtml's grid. The
   palette is carried over from that page verbatim so staff can compare the two
   side by side during the migration; it is deliberately NOT themed.
   --------------------------------------------------------------------------- */
.fs-browser {
  width: 99%;
  margin: auto;
  /* MIPS-6839: the page also carries Bootstrap's `container`, whose 15px side
     padding sits inside this 99% and costs the grid ~30px of the width the
     staff asked to get back. Trimmed rather than removed: dropping the
     container outright (the edge-to-edge look /data_grid/interface.phtml gets
     by having no container at all) measured WORSE here, because this page's
     container is also what keeps the content clear of the fixed sidebar. */
  padding-left: 4px;
  padding-right: 4px;
}
.fs-browser__quota {
  width: 100%;
  margin-bottom: 8px;
}
.fs-browser__quota td {
  text-align: center;
  padding: 3px;
}
.fs-browser__quota-storage {
  background-color: #a5c0d0;
}
.fs-browser__quota-files {
  background-color: #c5a0d0;
}
.fs-browser__quota-input {
  display: inline-block;
  width: 90px;
}
/* MIPS-7070: SFTP mirroring health banner. Sits between the quota bar and the
   upload panel, so it keeps the quota bar's bottom margin rather than adding
   a second gap of its own. */
.fs-browser__sftp-status {
  margin-bottom: 8px;
  padding: 8px 12px;
}
.fs-browser__sftp-status-heading {
  margin-bottom: 4px;
}
.fs-browser__sftp-status-hint {
  margin-bottom: 6px;
}
.fs-browser__sftp-status-list {
  margin: 0;
  padding-left: 20px;
}
.fs-browser__sftp-status-list > li + li {
  margin-top: 6px;
}
/* The cron's raw log line — kept monospaced and breakable so a long
   authentication error does not stretch the banner past the grid. */
.fs-browser__sftp-status-log {
  font-family: monospace;
  font-size: 90%;
  overflow-wrap: anywhere;
}
/* The per-error detail the cron now records alongside the summary. Indented
   under its own label and capped in height so a run that failed on ten files
   cannot push the file grid off the screen. */
.fs-browser__sftp-status-errors {
  margin-top: 4px;
}
ul.fs-browser__sftp-status-log {
  margin: 2px 0 0;
  padding-left: 18px;
  max-height: 9em;
  overflow-y: auto;
}
/* The badge on the SFTP folder row itself. Coloured here rather than with
   Bootstrap's bg-danger/bg-warning utilities: the grid renders under BS3,
   whose `.badge` rule sets its own grey background and wins, so those
   utilities leave the warning looking like an ordinary count badge. */
.fs-browser__sftp-badge--danger {
  background-color: #c9302c;
  color: #fff;
}
.fs-browser__sftp-badge--warning {
  background-color: #ec971f;
  color: #fff;
}
.fs-browser__panel {
  margin-bottom: 10px;
}
.fs-browser__new-folder {
  padding: 8px;
  background: #fbf8e3;
  border: 1px solid #e0d9b8;
}
.fs-browser__new-folder-input {
  margin-right: 6px;
  min-width: 260px;
}
.fs-browser__breadcrumb {
  background-color: #9bbad6;
  padding: 14px 0 4px;
  border: 1px solid #333;
}
.fs-browser__breadcrumb-count {
  color: #666;
}
.fs-browser__trello-link {
  margin-left: 8px;
  color: #0079bf;
}
.fs-browser__queue-link {
  margin-left: 8px;
  color: #31708f;
}
.fs-browser__toolbar {
  margin-bottom: 8px;
}
.fs-browser__toolbar-item {
  margin: 0 6px;
}
.fs-browser__bulkbar {
  padding: 6px 8px;
  background: #e9f1fb;
  border: 1px solid #9bbad6;
  border-top: 0;
}
.fs-browser__bulkbar-row {
  padding: 4px 0;
}
.fs-browser__bulkbar .btn {
  margin: 4px 6px;
}
.fs-browser__staff-cell {
  padding: 2px 4px;
}
/* MIPS-6479: only the free-text cells get the aggressive break, so a long
   unbreakable token in Notes cannot widen the whole grid past the viewport. */
.fs-browser__wrap-cell {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.fs-browser__count-line {
  padding: 4px 0;
}
.fs-browser td {
  padding: 4px !important;
}
/* MIPS-6438: the escape hatch back to the pre-React File Storage page. Kept
   visually quiet — it is a reference/fallback during the migration, not a
   primary action. */
.fs-browser__classic-link {
  opacity: 0.85;
}
.fs-browser__classic-link:hover {
  opacity: 1;
}
/* MIPS-6438: Processing Workflow cell — colour chip beside the select, matching
   the legacy grid's workflow indicator. */
.fs-browser__workflow-cell {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.fs-browser__workflow-cell .workflow-color-chip {
  display: inline-block;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  border-radius: 3px;
}
.fs-browser__workflow-add {
  font-weight: bold;
  color: #0d6efd;
}
.fs-browser__workflow-cell .workflow-info-icon {
  cursor: pointer;
  color: #f8f8f8;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: bold;
}
/* MIPS-6839: the grid's column budget. Declaring two widths under the default
   table-layout:auto was not enough — there a width is a hint, and the browser
   hands the slack to whichever column holds the longest unbroken run of text.
   That is the file name, so Name took 26.8% (621px measured) while Notes held
   only the 25% it had asked for, and the table rendered 2316px wide inside a
   ~2160px container, i.e. it scrolled sideways. table-layout:fixed makes these
   percentages authoritative: Name is capped, its long names wrap instead of
   stretching the column, Notes gets the room, and the table stops overflowing.
   Every column is listed because under fixed layout an unlisted column would be
   sized from the first row alone. The percentages are relative, so the non-staff
   view — which drops Status/ETE/Workflow — rescales the rest rather than leaving
   a gap. (table-layout itself is declared with the grid's font-size below, so
   the selector keeps a single rule.) */
.fs-browser__col-mark {
  width: 1.3%;
}
.fs-browser__col-icon {
  width: 1%;
}
.fs-browser__col-name {
  width: 16%;
}
.fs-browser__col-tools {
  width: 1.8%;
}
.fs-browser__col-size {
  width: 3%;
}
.fs-browser__col-modified {
  width: 4.6%;
}
.fs-browser__col-status {
  width: 6%;
}
.fs-browser__col-ete {
  width: 3.4%;
}
.fs-browser__col-year {
  width: 3.4%;
}
.fs-browser__col-workflow {
  width: 9%;
}
.fs-browser__col-notes {
  width: 37%;
}
.fs-browser__col-source {
  width: 7.2%;
}
.fs-browser__col-actions {
  width: 4.3%;
}
/* Fixed layout clips instead of widening, so anything without spaces — a file
   name, a long note — has to be allowed to break mid-word or it overflows its
   cell. */
.file-storage-browser-table table td,
.file-storage-browser-table table th {
  overflow-wrap: anywhere;
  padding: 3px 5px;
}

/* MIPS-6839: native <select>/<input> controls don't inherit font-size from
   an ancestor the way plain text does (their user-agent stylesheet sets an
   explicit default), which is why Status/ETE/Report Year/Processing Workflow
   looked smaller than Notes. Scoped to table cells only — and to the
   Per-page select by id — so this never reaches the unrelated "Search for..."
   input, which sits outside the <table> and was never part of this ticket.
   Checkboxes are excluded: native checkbox size isn't driven by font-size,
   and MarkCell's row-select checkbox lives inside a <td> too. */
.file-storage-browser-table table td select,
.file-storage-browser-table table td input:not([type="checkbox"]) {
  font-size: inherit;
}
/* MIPS-6839: the size the whole grid normalizes TO, and the reason it is 10pt
   rather than .small's 8pt. The "Notes text" the ticket asked the other columns
   to match is the staff note, whose stored HTML wraps its text in a <p> — and
   the global `p { font-size: 10pt }` (main.css:~90) overrides the table's
   inherited size there. Normalizing the grid down to 8pt therefore left that
   paragraph 25% larger than every file name beside it: the exact mismatch the
   ticket reported, still visible after the first pass. Match it upward. */
.file-storage-browser-table table {
  font-size: 10pt;
  table-layout: fixed;
}
#fs-per-page {
  /* MIPS-6839: matches the grid's own 10pt above — 'inherit' here picked up the
     ambient page font-size instead, since this select sits outside the <table>. */
  font-size: 10pt;
}

/* MIPS-6839: caps the Processing Workflow select so the longest workflow
   name can no longer balloon the column past its new 10% width. min-width:0
   is required because a flex child (this select's parent is display:flex)
   otherwise ignores max-width and refuses to shrink below its content size.
   The existing title={...} tooltip on this select (FileStorageBrowserCells.jsx)
   already covers full-name legibility when the value is visually clipped. */
.fs-browser__workflow-cell select {
  max-width: 140px;
  min-width: 0;
}
.fs-browser__destination {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.fs-browser__destination select {
  display: inline-block;
  width: auto;
  max-width: 320px;
}
/* MIPS-6438: the Trello icon turns green once a matching card is found,
   matching the legacy lookup's own cue. */
.fs-browser__trello-link--found {
  color: #2eb85c !important;
}

/* MIPS-6593: PQRS File Uploads (React). The staff-notes sub-block wears the
   shared `.bg-staff` pink, exactly as the classic pqrs.file_storage_import.tpl
   does, so the two views match. Only its geometry and the blue left-border
   accent live here — the colour stays in the one `.bg-staff` token above. */
.fs-import__staff-notes {
  padding: 4px 6px;
  margin-top: 4px;
  border-left: 3px solid #0d6efd;
  font-size: 12px;
  word-break: break-word;
}

/* MIPS-6922 — WatchDogs tables on the Run Scripts console.
   Keep the row height in sync with WATCHDOGS_ROW_HEIGHT in
   reactJSX/components/WatchDogs/WatchDogsList.rows.jsx; WatchDogsListRows.Unit.jsx fails if
   they drift. BTTable derives its virtual-scroll padding from that number, and in table
   layout `height` is a minimum, so the ellipsis rule below is what keeps rows single-line
   and the floor honest.

   NOTE for future readers: BTTable already stamps style={{height: resolvedRowHeight}} inline
   on every data <tr>, and an inline style beats a stylesheet rule — so the rule below only
   actually drives the "No records found" row, which BTTable does not stamp. It is kept anyway,
   matching the .ai-runs-table-wrap precedent above, and the drift test keeps the two numbers
   from disagreeing. The ellipsis rule IS load-bearing: it is what stops a cell wrapping past
   the height BTTable was told about. */
.watchdogs-table-wrap tbody > tr {
  height: 64px;
}

/* Close the wrapping hazard for EVERY column at once rather than per cell: the Running For
   ("1h 40m 5s") and Started cells are multi-token too, and any column added later would
   otherwise reintroduce the risk. Two wrapped lines still fit under 64px; three do not, and a
   row taller than the height BTTable was told corrupts its virtual-scroll padding. */
.watchdogs-table-wrap tbody > tr > td {
  white-space: nowrap;
}

.watchdogs-table-wrap .watchdogs-cell-ellipsis {
  display: inline-block;
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}

/* MIPS-6438: cross-account move — the account search box and its match list. */
.fs-browser__destination-account {
  position: relative;
  display: inline-block;
}
.fs-browser__destination-account input {
  display: inline-block;
  width: auto;
  min-width: 200px;
}
.fs-browser__destination-matches {
  position: absolute;
  z-index: 20;
  list-style: none;
  margin: 2px 0 0;
  padding: 4px 0;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  max-height: 220px;
  overflow-y: auto;
  min-width: 240px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}
.fs-browser__destination-matches li {
  padding: 0 6px;
  white-space: nowrap;
}

/* MIPS-6995: Data Preview search highlight — the CSS half of a contract whose
   JS half exists TWICE, once per page. MIPS-6438 copied (not moved) the Data
   Preview search JS into www/js/file-storage-tools.js for the React browser;
   modules/file_storage/interface.phtml kept its own inline copy and does not
   load the shared file. Both copies do the same two things: wrap each match in
   <span class="data-preview-match">, and mark the active cell
   .data-preview-highlight-current.

   What MIPS-6438 did NOT copy was the colouring, which stayed behind in the
   legacy page's inline <style>. So the React browser — which lazy-loads the
   script and no stylesheet (useFileStorageTools.jsx) — applied both classes to
   cells that had no rule to match: search counted matches and scrolled to them,
   and nothing lit up.

   These rules live here because standard_css.inc is the one stylesheet include
   BOTH pages already carry — the legacy page at interface.phtml:264 and the
   React SPA shell (MDI_REACT_ROUTE -> principals/users/interface.phtml) at :30.
   It links main.css directly on a dev machine (standard_css.inc:250) and the
   deployed main.<timestamp>.css copy of this same file otherwise (:253, via
   GetHTMLFiles::mainCSS; post-update.sh makes that copy on deploy).
   Values and property order are carried over unchanged from the inline block
   they replace, so the legacy page renders exactly as before.

   Scoped to #dataPreviewContent, the container BOTH JS copies build and the
   only place either one applies these classes ($('#dataPreviewContent td')).
   Two names this generic should not squat the global namespace of a stylesheet
   every authenticated page loads. DataPreviewHighlightCss.Unit.jsx pins that
   container id on both sides, since the scope is only correct while it holds. */
#dataPreviewContent .data-preview-match {
  background-color: #ffff00;
  padding: 1px 2px;
  border-radius: 2px;
}
/* !important is inherited from the inline original and kept deliberately —
   NOT because anything currently outranks this rule. Nothing does: Bootstrap
   3's striping and hover paint the <tr>, which a <td> background covers at any
   specificity, and generateDataPreviewTable emits its <td>s with no class at
   all. It stays because dropping it is a behaviour change no test in this repo
   can see, and that does not belong in a bug fix. Remove it on purpose or not
   at all. */
#dataPreviewContent .data-preview-highlight-current {
  background-color: #ff9800 !important;
}
/* The matched substring inside the ACTIVE cell: deeper orange on white, so the
   one match you navigated to stays distinguishable from the other matches now
   sitting on the same orange cell. */
#dataPreviewContent .data-preview-highlight-current .data-preview-match {
  background-color: #ff5722;
  color: #fff;
}

/* MIPS-6994 triage funnel. Same card shell as .ai-monitor-hero so the two panels
   read as one stack rather than two unrelated widgets. */
.ai-tickets-monitor-page .ai-monitor-funnel {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 1rem 1.25rem;
  margin-bottom: 12px;
}
.ai-tickets-monitor-page .ai-monitor-funnel-heading {
  font-size: 15px;
  font-weight: 600;
  margin: 0 0 2px;
}
.ai-tickets-monitor-page .ai-monitor-funnel-caption {
  margin-bottom: 10px;
}
/* Stages wrap rather than shrink, for the same reason the hero's columns do: a
   squeezed count is unreadable, a second row is not. */
.ai-tickets-monitor-page .ai-monitor-funnel-stages {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 8px 24px;
}
.ai-tickets-monitor-page .ai-monitor-funnel-stage {
  flex: 1 1 130px;
  min-width: 120px;
  padding-left: 16px;
  border-left: 1px solid #eee;
}
.ai-tickets-monitor-page .ai-monitor-funnel-stage:first-child {
  padding-left: 0;
  border-left: 0;
}
/* The count is the link. Kept at the page's default link colour ONLY when the stage
   has no tone of its own — the tone classes (text-warning etc.) carry meaning and
   must win, so no colour is set here. */
.ai-tickets-monitor-page .ai-monitor-funnel-value {
  display: block;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
}
.ai-tickets-monitor-page .ai-monitor-funnel-value:hover,
.ai-tickets-monitor-page .ai-monitor-funnel-value:focus {
  text-decoration: underline;
}
.ai-tickets-monitor-page .ai-monitor-funnel-label {
  font-size: 12px;
  line-height: 1.3;
}
.ai-tickets-monitor-page .ai-monitor-funnel-toggle {
  padding: 0;
  font-size: 12px;
}
.ai-tickets-monitor-page .ai-monitor-funnel-note {
  margin-top: 10px;
}
.ai-tickets-monitor-page .ai-monitor-funnel-lost {
  margin-top: 10px;
  max-height: 420px;
  overflow-y: auto;
}
.ai-tickets-monitor-page .ai-monitor-funnel-lost-empty {
  margin-top: 10px;
}

/* MIPS-7001 — a hero count is a <button> when it is clickable. Strip the UA button
   chrome so it renders identically to the <span> it replaces: the affordance is the
   pointer + hover underline, NOT a box. Colour is deliberately not set here — the tone
   class (text-info / text-danger / …) carries meaning and must keep winning. */
.ai-tickets-monitor-page button.ai-monitor-hero-cell-value.is-clickable {
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  color: inherit;
  line-height: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
.ai-tickets-monitor-page button.ai-monitor-hero-cell-value.is-clickable:hover,
.ai-tickets-monitor-page button.ai-monitor-hero-cell-value.is-clickable:focus {
  text-decoration: underline;
}
/* Keyboard users must still get a visible ring — the hover underline alone is not a
   focus indicator, and removing the outline without replacing it fails WCAG 2.4.7. */
.ai-tickets-monitor-page button.ai-monitor-hero-cell-value.is-clickable:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* MIPS-6990: React Form Builder list. The search box was the legacy page's
   inline width: 400px; it lives here rather than in the JSX because styles
   belong in the stylesheet (reactJSX/AGENTS.md). max-width keeps it from
   overflowing a narrow viewport. */
.form-builder__search-input {
  width: 400px;
  max-width: 100%;
}

/* MIPS-6991: React DedupliFHIR landing screen. The "Search Methods" panel was
   an .alert carrying the legacy page's inline background/border/padding; the
   declarations live here rather than in the JSX because styles belong in the
   stylesheet (reactJSX/AGENTS.md). These four values are the legacy page's
   verbatim. The list's own 10px top margin is NOT here — it is the mt-10
   utility on the <ul>, since a spacing utility already exists for it. */
.deduplifhir__search-methods {
  background-color: #f9f9f9;
  border: 1px solid #ddd;
  color: #333;
  padding: 15px;
  border-radius: 4px;
}

/* MIPS-7176: QRDA Archive Assistant chat. The assistant answers in markdown —
   headings, a table whenever it compares counts, backticked codes and SQL — and
   the first cut printed that into a <pre>, which rendered literal `##` and pipe
   characters in whatever colour the surrounding page happened to set. Reported
   as "gray letters on gray background".

   Colours are stated rather than inherited on purpose: this panel opens over a
   legacy page whose text colour is not ours to predict, and a denominator a
   customer decision rests on must not be low-contrast because of a stylesheet
   two levels up. Values are the app's existing Bootstrap greys, so the panel
   still reads as part of the product.

   These live here and not in the JSX because styles belong in the stylesheet
   (reactJSX/AGENTS.md). */
.qrda-cohort-ai__thread {
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  padding: 14px 16px;
  max-height: 60vh;
  overflow-y: auto;
}

/* The user's own turn, right-aligned but with its text left-aligned — a
   right-aligned sentence is hard to read back. */
.qrda-cohort-ai__user {
  display: inline-block;
  text-align: left;
  background: #e7f1ff;
  border: 1px solid #b6d4fe;
  color: #212529;
  border-radius: 10px;
  padding: 8px 12px;
  max-width: 85%;
  font-size: 14px;
}

.qrda-cohort-ai__body {
  color: #212529;
  font-size: 14px;
}

.qrda-cohort-ai__heading {
  font-size: 16px;
  font-weight: 600;
  color: #212529;
  margin: 14px 0 6px;
}

.qrda-cohort-ai__heading--sub {
  font-size: 14px;
}

.qrda-cohort-ai__para {
  margin: 0 0 10px;
  color: #212529;
  line-height: 1.55;
}

.qrda-cohort-ai__list {
  margin: 0 0 10px;
  padding-left: 22px;
  color: #212529;
}

.qrda-cohort-ai__list li {
  margin-bottom: 3px;
}

/* A wide table scrolls in its own box rather than stretching the panel. */
.qrda-cohort-ai__table-wrap {
  overflow-x: auto;
  margin-bottom: 12px;
}

.qrda-cohort-ai__table {
  border-collapse: collapse;
  width: 100%;
  font-size: 13px;
  color: #212529;
}

.qrda-cohort-ai__table th,
.qrda-cohort-ai__table td {
  border: 1px solid #dee2e6;
  padding: 6px 10px;
  text-align: left;
}

.qrda-cohort-ai__table th {
  background: #f8f9fa;
  font-weight: 600;
}

/* Counts right-align so a denominator waterfall reads down the column. */
.qrda-cohort-ai__table td.qrda-cohort-ai__num {
  text-align: right;
}

.qrda-cohort-ai__code {
  background: #f1f3f5;
  color: #c7254e;
  padding: 1px 5px;
  border-radius: 3px;
  font-size: 90%;
}

/* Shown only when the numbers came from the measure importer rather than from
   a query the model wrote. That distinction is the whole point of the tool, so
   it gets a badge and not muted text. */
.qrda-cohort-ai__provenance {
  display: inline-block;
  background: #d1e7dd;
  border: 1px solid #a3cfbb;
  color: #0a3622;
  border-radius: 4px;
  padding: 3px 9px;
  font-size: 12px;
  margin-bottom: 8px;
}

/* The SQL behind a number, so a reviewer can check it instead of trusting it.
   Monospaced and wrapped — some of these are long. */
.qrda-cohort-ai__trace {
  color: #6c757d;
  font-size: 11.5px;
  font-family: monospace;
  word-break: break-word;
  border-top: 1px dashed #dee2e6;
  padding-top: 6px;
  margin-top: 4px;
}

/* MIPS-7176: the ask box. Was two inline widths on the form-group and the
   input; here for the same reason as the block above. */
.qrda-cohort-ai__ask {
  width: 80%;
}

.qrda-cohort-ai__ask .form-control {
  width: 100%;
}

/* MIPS-7179: the Request Invoice "Send MDinteractive confirmation email" opt-in.
   It is the only control on the staff band that is not a text field, and at the
   browser's default 13px on the pink background it read as part of the label
   above it, so staff kept sending the account owner an invoice notice meant for
   a different payer. The declarations live here rather than in the JSX because
   styles belong in the stylesheet (reactJSX/AGENTS.md). */
.invoice-confirmation-optin {
  padding: 8px 10px;
  margin-bottom: 0;
}

.invoice-confirmation-optin label {
  margin-bottom: 0;
  cursor: pointer;
}

.invoice-confirmation-optin input[type="checkbox"] {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 8px;
  vertical-align: middle;
}

.invoice-confirmation-optin__hint {
  margin-left: 26px;
}

/* MIPS-7224 — the staff wrench menu mixes server-rendered <li> items
   (ajax_files_list.phtml) with React-authored ones. React forbids children
   beside dangerouslySetInnerHTML on one element, so the injected block sits in
   a wrapper; `display: contents` removes that wrapper's own box so both sets
   lay out as a single dropdown list. Without this the injected items become a
   nested block and the menu renders as two stacked groups. */
.file-tools-legacy-items {
  display: contents;
}

/* Match the injected items' look so a React-authored entry is not visibly a
   different species from its neighbours.

   The server-built items are `<a class="btn btn-sm btn-block">`, and a bare
   Bootstrap .btn sets no colour of its own — so on an anchor they inherit the
   link blue while an equivalent <button> inherits the body colour and reads as
   the odd one out. The colour is therefore stated here rather than left to the
   element type, so the item stays a real <button> (focusable, no href="javascript:;")
   and still looks like its neighbours. #337ab7 / #23527c are this app's
   Bootstrap-3 link and link-hover blues. */
.file-tools-native-item {
  padding: 5px;
  text-align: left !important;
  width: 100%;
  color: #337ab7;
  background: none;
  border: none;
}

.file-tools-native-item:hover,
.file-tools-native-item:focus {
  color: #23527c;
  text-decoration: none;
}

/* MIPS-7224 — the extract modal streams the console run's log tail while it
   works. Bounded height so a bundle with hundreds of members cannot push the
   Extract button off screen mid-run. */
.file-storage-athena-extract__log {
  max-height: 240px;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 12px;
}

.file-storage-athena-extract__file {
  font-weight: 600;
}

/* MIPS-7285 — a folder whose navigation fetch is in flight. The in-flight guard
   drops retry clicks by design (a retry restarts the wait), so the FIRST click
   has to be visibly acknowledged at the row itself; a status strip above a long
   listing is nowhere near where the user is looking. */
.file-storage-folder-opening {
  opacity: 0.6;
  cursor: progress;
}

/* MIPS-7547: the folder's autonomous-routing TIN map, under the breadcrumb.
   Compact on purpose -- it sits above the grid on every staff folder view, so
   collapsed it must cost about one line. */
.fs-browser__tinmap {
  margin-bottom: 8px;
}
.fs-browser__tinmap .panel {
  margin-bottom: 0;
}
.fs-browser__tinmap-heading {
  cursor: pointer;
  padding: 6px 10px;
}
.fs-browser__tinmap-body {
  padding: 10px;
}
.fs-browser__tinmap-hint {
  margin-bottom: 8px;
}
.fs-browser__tinmap-flag {
  margin-left: 6px;
}
.fs-browser__tinmap-note {
  font-size: 90%;
  overflow-wrap: anywhere;
}
.fs-browser__tinmap-table {
  margin-bottom: 8px;
}
.fs-browser__tinmap-table code {
  font-size: 100%;
}
/* A disabled mapping stays listed -- re-enabling it is half the point of the
   panel -- but must not read as one that is routing. */
.fs-browser__tinmap-row--disabled td {
  opacity: 0.6;
}
.fs-browser__tinmap-action-col {
  width: 90px;
  text-align: right;
}
.fs-browser__tinmap-suggestions {
  margin-bottom: 8px;
}
.fs-browser__tinmap-suggestion {
  margin: 0 4px 4px 0;
}
.fs-browser__tinmap-add input {
  width: 140px;
}