.bg-left {
  background-color: #6a82d1;
  color: #fff !important;
}

.bg-primary {
  background-color: #5d9cec;
  color: #fff !important;
}

.bg-success {
  background-color: #27c24c;
  color: #fff !important;
}

.bg-info {
  background-color: #23caf8;
  color: #fff !important;
}

.bg-warning {
  background-color: #ff902b;
  color: #fff !important;
}

.bg-danger {
  background-color: #f05050;
  color: #fff !important;
}

.bg-inverse {
  background-color: #131e26;
  color: #fff !important;
}

.bg-success-light {
  background-color: #43d967;
  color: #fff !important;
}

.bg-gray-darker {
  background-color: #232735;
  color: #fff !important;
}

.bg-gray-dark {
  background-color: #3a3f51;
  color: #fff !important;
}

.bg-gray {
  background-color: #979ea1;
  color: #656565 !important;
}

.bg-gray-light {
  background-color: #d4dadc;
  color: #656565 !important;
}

.bg-gray-lighter {
  background-color: #edf1f2;
  color: #656565 !important;
}

.base {
  background-color: #012C3D;
  color: #fff;
}

.alter {
  background-color: #455D79;
  color: #fff;
}

.ground {
  background-color: #f5f5f5;
  color: #012C3D;
}

.off {
  background-color: #f5f5f5;
  color: #012C3D;
}

.plane {
  background-color: #fff;
  color: #012C3D;
}

.space {
  background-color: #d1d4d5;
}

.highlight {
  background-color: #F9B233;
}

.change-area {
  background-color: #fffaeb;
}

.mark {
  background-color: #d9eeff !important;
}

.green {
  background-color: #a6d2b1 !important;
}

.dark-green {
  background-color: #7aa267 !important;
}

.red {
  background-color: #f7b3b3 !important;
}

.orange {
  background-color: #fad0a5 !important;
}

.purple {
  background-color: #c0b3f7 !important;
}

.blue {
  background-color: #b3cdf7 !important;
}

.bg-waiting {
  background-color: #fffaeb !important;
}

.bg-started {
  background-color: #b3cdf7 !important;
}

.bg-completed {
  background-color: #a6d2b1 !important;
}

.bg-rejected {
  background-color: #f7b3b3 !important;
}

.bg-skipped {
  background-color: #ddd !important;
}

.text-highlight {
  color: #F9B233;
}

.text-soft {
  color: #c69eaa;
}

.active-light-bg {
  background-color: #ffddd8;
}

.tag-light-bg {
  background-color: #dae5ff;
}

.text-tag {
  color: #3480ac;
}

.text-disabled {
  color: #d1d4d5;
}

.text-active {
  color: #dc4f77;
}

.text-danger {
  color: #f05050;
}

.text-mark {
  color: #d9eeff;
}

.caption {
  color: #abaeaf;
  font-size: 90%;
}

.caption.active {
  color: #dc4f77;
}

.tag {
  display: inline-block;
  background-color: #455D79;
  font-size: 80%;
  font-weight: bold;
  padding: 1px 6px;
  margin: 0px 4px;
  color: #fff;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
}

.tag .tag-button {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline;
  margin-left: 3px;
  margin-right: -3px;
  padding-left: 2px;
}

.tag .tag-button:hover {
  color: #ddd;
}

.tag.green {
  border: 1px solid #5a784b;
  color: #5a784b;
}

.tag.green .tag-button:hover {
  color: #445b39;
}

.tag.blue {
  border: 1px solid #716fd3;
  color: #716fd3;
}

.tag.blue .tag-button:hover {
  color: #5856a4;
}

.text-light {
  color: #fff;
}

.m0 {
  margin: 0px !important;
}

.ml0 {
  margin-left: 0px !important;
}

.mr0 {
  margin-right: 0px !important;
}

.mt0 {
  margin-top: 0px !important;
}

.mb0 {
  margin-bottom: 0px !important;
}

.mh0 {
  margin-left: 0px !important;
  margin-left: 0 !important;
  margin-right: 0px !important;
  margin-right: 0 !important;
}

.mv0 {
  margin-top: 0px !important;
  margin-top: 0 !important;
  margin-bottom: 0px !important;
  margin-bottom: 0 !important;
}

.m-xs {
  margin: 2px !important;
}

.ml-xs {
  margin-left: 2px !important;
}

.mr-xs {
  margin-right: 2px !important;
}

.mt-xs {
  margin-top: 2px !important;
}

.mb-xs {
  margin-bottom: 2px !important;
}

.mh-xs {
  margin-left: 2px !important;
  margin-right: 2px !important;
}

.mv-xs {
  margin-top: 2px !important;
  margin-bottom: 2px !important;
}

.m-sm {
  margin: 4px !important;
}

.ml-sm {
  margin-left: 4px !important;
}

.mr-sm {
  margin-right: 4px !important;
}

.mt-sm {
  margin-top: 4px !important;
}

.mb-sm {
  margin-bottom: 4px !important;
}

.mh-sm {
  margin-left: 4px !important;
  margin-left: 5px !important;
  margin-right: 4px !important;
  margin-right: 5px !important;
}

.mv-sm {
  margin-top: 4px !important;
  margin-top: 5px !important;
  margin-bottom: 4px !important;
  margin-bottom: 5px !important;
}

.m-md {
  margin: 8px !important;
}

.ml-md {
  margin-left: 8px !important;
}

.mr-md {
  margin-right: 8px !important;
}

.mt-md {
  margin-top: 8px !important;
}

.mb-md {
  margin-bottom: 8px !important;
}

.mh-md {
  margin-left: 8px !important;
  margin-right: 8px !important;
}

.mv-md {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

.m-lg {
  margin: 16px !important;
}

.ml-lg {
  margin-left: 16px !important;
}

.mr-lg {
  margin-right: 16px !important;
}

.mt-lg {
  margin-top: 16px !important;
}

.mb-lg {
  margin-bottom: 16px !important;
}

.mh-lg {
  margin-left: 16px !important;
  margin-left: 15px !important;
  margin-right: 16px !important;
  margin-right: 15px !important;
}

.mv-lg {
  margin-top: 16px !important;
  margin-top: 15px !important;
  margin-bottom: 16px !important;
  margin-bottom: 15px !important;
}

.p0 {
  padding: 0px !important;
}

.pl0 {
  padding-left: 0px !important;
}

.pr0 {
  padding-right: 0px !important;
}

.pt0 {
  padding-top: 0px !important;
}

.pb0 {
  padding-bottom: 0px !important;
}

.ph0 {
  padding-left: 0px !important;
  padding-left: 0 !important;
  padding-right: 0px !important;
  padding-right: 0 !important;
}

.pv0 {
  padding-top: 0px !important;
  padding-top: 0 !important;
  padding-bottom: 0px !important;
  padding-bottom: 0 !important;
}

.p-sm {
  padding: 4px !important;
}

.pl-sm {
  padding-left: 4px !important;
}

.pr-sm {
  padding-right: 4px !important;
}

.pt-sm {
  padding-top: 4px !important;
}

.pb-sm {
  padding-bottom: 4px !important;
}

.ph-sm {
  padding-left: 4px !important;
  padding-left: 5px !important;
  padding-right: 4px !important;
  padding-right: 5px !important;
}

.pv-sm {
  padding-top: 4px !important;
  padding-top: 5px !important;
  padding-bottom: 4px !important;
  padding-bottom: 5px !important;
}

.p-md {
  padding: 8px !important;
}

.pl-md {
  padding-left: 8px !important;
}

.pr-md {
  padding-right: 8px !important;
}

.pt-md {
  padding-top: 8px !important;
}

.pb-md {
  padding-bottom: 8px !important;
}

.ph-md {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.pv-md {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.p-lg {
  padding: 16px !important;
}

.pl-lg {
  padding-left: 16px !important;
}

.pr-lg {
  padding-right: 16px !important;
}

.pt-lg {
  padding-top: 16px !important;
}

.pb-lg {
  padding-bottom: 16px !important;
}

.ph-lg {
  padding-left: 16px !important;
  padding-left: 15px !important;
  padding-right: 16px !important;
  padding-right: 15px !important;
}

.pv-lg {
  padding-top: 16px !important;
  padding-top: 15px !important;
  padding-bottom: 16px !important;
  padding-bottom: 15px !important;
}

.bold {
  font-weight: bold;
}

body {
  margin: 0px;
  font-size: 12px;
  font-family: "IBM Plex Sans", sans-serif;
  background-color: #012C3D;
}

input {
  font-family: "IBM Plex Sans", sans-serif;
}

.m0 {
  margin: 0 !important;
}

.ml0 {
  margin-left: 0 !important;
}

.mr0 {
  margin-right: 0 !important;
}

.mt0 {
  margin-top: 0 !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.m {
  margin: 10px !important;
}

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

.mr {
  margin-right: 10px !important;
}

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

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

.m-sm {
  margin: 5px !important;
}

.ml-sm {
  margin-left: 5px !important;
}

.mr-sm {
  margin-right: 5px !important;
}

.mt-sm {
  margin-top: 5px !important;
}

.mb-sm {
  margin-bottom: 5px !important;
}

.m-lg {
  margin: 15px !important;
}

.ml-lg {
  margin-left: 15px !important;
}

.mr-lg {
  margin-right: 15px !important;
}

.mt-lg {
  margin-top: 15px !important;
}

.mb-lg {
  margin-bottom: 15px !important;
}

.m-xl {
  margin: 30px !important;
}

.ml-xl {
  margin-left: 30px !important;
}

.mr-xl {
  margin-right: 30px !important;
}

.mt-xl {
  margin-top: 30px !important;
}

.mb-xl {
  margin-bottom: 30px !important;
}

.mv {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.mh {
  margin-left: 10px !important;
  margin-right: 10px !important;
}

.mv-lg {
  margin-top: 16px !important;
  margin-top: 15px !important;
  margin-bottom: 16px !important;
  margin-bottom: 15px !important;
}

.mh-lg {
  margin-left: 16px !important;
  margin-left: 15px !important;
  margin-right: 16px !important;
  margin-right: 15px !important;
}

.mv-sm {
  margin-top: 4px !important;
  margin-top: 5px !important;
  margin-bottom: 4px !important;
  margin-bottom: 5px !important;
}

.mh-sm {
  margin-left: 4px !important;
  margin-left: 5px !important;
  margin-right: 4px !important;
  margin-right: 5px !important;
}

.p0 {
  padding: 0 !important;
}

.pl0 {
  padding-left: 0 !important;
}

.pr0 {
  padding-right: 0 !important;
}

.pt0 {
  padding-top: 0 !important;
}

.pb0 {
  padding-bottom: 0 !important;
}

.pv0 {
  padding-top: 0px !important;
  padding-top: 0 !important;
  padding-bottom: 0px !important;
  padding-bottom: 0 !important;
}

.ph0 {
  padding-left: 0px !important;
  padding-left: 0 !important;
  padding-right: 0px !important;
  padding-right: 0 !important;
}

.p {
  padding: 10px !important;
}

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

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

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

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

.p-sm {
  padding: 5px !important;
}

.pl-sm {
  padding-left: 5px !important;
}

.pr-sm {
  padding-right: 5px !important;
}

.pt-sm {
  padding-top: 5px !important;
}

.pb-sm {
  padding-bottom: 5px !important;
}

.p-lg {
  padding: 15px !important;
}

.pl-lg {
  padding-left: 15px !important;
}

.pr-lg {
  padding-right: 15px !important;
}

.pt-lg {
  padding-top: 15px !important;
}

.pb-lg {
  padding-bottom: 15px !important;
}

.p-xl {
  padding: 30px !important;
}

.pl-xl {
  padding-left: 30px !important;
}

.pr-xl {
  padding-right: 30px !important;
}

.pt-xl {
  padding-top: 30px !important;
}

.pb-xl {
  padding-bottom: 30px !important;
}

.pv {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.ph {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.pv-xl {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.ph-xl {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.pv-lg {
  padding-top: 16px !important;
  padding-top: 15px !important;
  padding-bottom: 16px !important;
  padding-bottom: 15px !important;
}

.ph-lg {
  padding-left: 16px !important;
  padding-left: 15px !important;
  padding-right: 16px !important;
  padding-right: 15px !important;
}

.pv-sm {
  padding-top: 4px !important;
  padding-top: 5px !important;
  padding-bottom: 4px !important;
  padding-bottom: 5px !important;
}

.ph-sm {
  padding-left: 4px !important;
  padding-left: 5px !important;
  padding-right: 4px !important;
  padding-right: 5px !important;
}

.b0 {
  border-width: 0 !important;
}

.bl0 {
  border-left-width: 0 !important;
}

.br0 {
  border-right-width: 0 !important;
}

.bt0 {
  border-top-width: 0 !important;
}

.bb0 {
  border-bottom-width: 0 !important;
}

.br {
  border-right: 1px solid rgba(0, 0, 0, 0.12);
}

.bl {
  border-left: 1px solid rgba(0, 0, 0, 0.12);
}

.bt {
  border-top: 1px solid rgba(0, 0, 0, 0.12);
}

.bb {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.b,
.ba {
  border-right: 1px solid rgba(0, 0, 0, 0.12);
  border-left: 1px solid rgba(0, 0, 0, 0.12);
  border-top: 1px solid rgba(0, 0, 0, 0.12);
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.radius-clear {
  border-radius: 0 !important;
}

.with-border {
  border: 1px solid #e2e5e6;
}

.small-radius {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.medium-radius {
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}

.border-small-radius {
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.border-medium-radius {
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}

.top-border {
  border-top: 1px solid #e2e5e6;
}

.bottom-border {
  border-bottom: 1px solid #e2e5e6;
}

.left-border {
  border-left: 1px solid #e2e5e6;
}

.right-border {
  border-right: 1px solid #e2e5e6;
}

.shadow-clear {
  box-shadow: 0 0 0 #000 !important;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-white {
  color: #fff;
}

.text-inverse {
  color: #131e26;
}

.text-alpha {
  color: rgba(255, 255, 255, 0.5);
}

.text-dark {
  color: #3a3f51;
}

.text-alpha-inverse {
  color: rgba(0, 0, 0, 0.5);
}

.text-gray-darker {
  color: #232735;
}

.text-gray-dark {
  color: #3a3f51;
}

.text-gray {
  color: #979ea1;
}

.text-gray-light {
  color: #d4dadc;
}

.text-gray-lighter {
  color: #edf1f2;
}

.text-xs {
  font-size: 10px;
}

.text-sm {
  font-size: 12px;
}

.text-base {
  font-size: 14px;
}

.text-md {
  font-size: 18px;
}

.text-lg {
  font-size: 26px;
}

span.small,
em.small,
strong.small {
  font-size: 12px;
}

.text-nowrap {
  white-space: nowrap;
}

.text-thin {
  font-weight: 100 !important;
}

.text-normal {
  font-weight: normal !important;
}

.text-bold {
  font-weight: bold !important;
}

.inline {
  display: inline-block !important;
}

.block-center {
  margin: 0 auto;
}

.vertical-scroll {
  max-height: 100%;
  overflow-y: auto;
}

.form-control + .form-control-feedback {
  right: 0;
  left: auto;
  top: 10px;
}

.navbar-nav {
  margin: 0px;
  float: left;
}

.navbar-nav > li {
  float: left;
}

.navbar-text {
  float: left;
  margin-right: 15px;
  margin-left: 15px;
}

@media (max-width: 768px) {
  .navbar-text {
    margin-right: 8px;
    margin-left: 8px;
  }
}

@media (max-width: 768px) {
  .navbar .container-fluid {
    padding-right: 0px;
    padding-left: 0px;
  }
}

@media (max-width: 768px) {
  .navbar .container-fluid .navbar-header {
    margin-right: 0px;
    margin-left: -4px;
  }
}

.navbar-nav > li > a {
  padding: 15px 8px;
  margin-right: 7px;
  margin-left: 7px;
  margin-top: 0px;
  margin-bottom: 0px;
}

@media (max-width: 768px) {
  .navbar-nav > li > a {
    margin-right: 0px;
    margin-left: 0px;
  }
}

.navbar-nav .open .dropdown-menu {
  position: absolute;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.15);
}

.view-bar {
  background-color: #fff;
  border-bottom: 1px solid #e2e5e6;
  padding: 4px 8px;
}

.view-bar .view-bar-item {
  padding: 8px 8px;
  color: #012C3D;
  display: inline-block;
  position: relative;
}

.view-bar .view-bar-item.active {
  color: #F9B233;
}

.topic-views {
  background-color: #fff;
  padding: 0px 4px;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.topic-views .topic-item {
  padding: 8px 8px;
  font-weight: bold;
  color: #012C3D;
  display: inline-block;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.topic-views .topic-item.active {
  color: #F9B233;
}

.topic-views .topic-item.active::before {
  content: '';
  position: absolute;
  left: 25%;
  right: 25%;
  bottom: 3px;
  height: 3px;
  -webkit-border-radius: 1.5px;
  -moz-border-radius: 1.5px;
  border-radius: 1.5px;
  background-color: #F9B233;
}

.topic-views > .separator {
  padding: 8px 0px;
  border-right: 1px solid #e2e5e6;
  position: relative;
}

.topic-views > .category {
  display: flex;
  flex-direction: row;
  position: relative;
}

.flex-container,
.flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
}

.flex-container.horizontal,
.flex.horizontal {
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

.flex-container.vertical,
.flex.vertical {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.flex-vertical {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.flex-horizontal {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

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

.align-top td {
  vertical-align: top;
}

.nowrap {
  white-space: nowrap;
}

.float-right {
  float: right;
}

.float-left {
  float: left;
}

.right-bottom {
  position: absolute;
  right: 0px;
  bottom: 0px;
}

.right-top {
  position: absolute;
  right: 0px;
  top: 0px;
}

.left-bottom {
  position: absolute;
  left: 0px;
  bottom: 0px;
}

.left-top {
  position: absolute;
  left: 0px;
  top: 0px;
}

.nav-bar {
  background-color: #fff;
  border-bottom: 1px solid #e2e5e6;
  padding: 5px 12px;
}

.nav-bar .title {
  color: #012C3D;
  font-weight: bold;
}

.model-dialog > .header {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.model-dialog > .header .title {
  color: #012C3D;
}

.section {
  top: 48px;
}

.frame {
  height: 100%;
  width: 100%;
  flex-direction: row;
  display: flex;
}

.frame .config-panel {
  flex-direction: row;
  display: flex;
  border-right: 1px solid #e2e5e6;
  color: #fff;
}

.frame .config-panel .content {
  margin-top: 8px;
  margin-left: 8px;
  margin-bottom: 8px;
  overflow-y: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.frame .config-panel .content::-webkit-scrollbar {
  display: none;
}

.frame .config-panel .expander {
  display: flex;
  align-items: center;
  padding: 3px;
  color: #455D79;
}

.frame .config-panel .expander:hover {
  background-color: #455D79;
  color: #F9B233;
}

.frame .config-panel .expander::after {
  content: '\f142';
  font-family: FontAwesome;
}

.frame .view {
  flex-grow: 1;
}

.view {
  height: 100%;
  background-color: #f5f5f5;
  flex-direction: column;
  display: flex;
}

.view .detail {
  flex-grow: 1;
  position: relative;
}

.view .content {
  flex-grow: 1;
  position: relative;
}

.master {
  background-color: #fff;
  width: 100%;
  padding: 8px;
}

.master .title {
  color: #012C3D;
  font-weight: bold;
  margin-bottom: 12px;
}

.popup .master {
  width: auto;
  margin: 10px;
}

.block {
  margin-left: 16px;
  margin-right: 16px;
  vertical-align: top;
}

.detail-bar {
  z-index: 100;
  position: relative;
  margin-left: 24px;
  margin-right: 24px;
  margin-top: 8px;
  margin-bottom: 2px;
  height: 40px;
}

.detail-bar .left {
  position: absolute;
  left: 0px;
  top: 0px;
}

.detail-bar .right {
  position: absolute;
  right: 0px;
  top: 0px;
}

.detail-bar .center {
  position: absolute;
  text-align: center;
}

.detail {
  background-color: #fff;
  margin-left: 24px;
  margin-right: 24px;
  margin-bottom: 16px;
  padding: 8px;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
}

.detail > * {
  position: absolute;
}

.detail > .header {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  left: 16px;
  right: 8px;
  top: 4px;
  font-size: 105%;
  font-weight: bold;
}

.detail > .table {
  width: auto;
  left: 16px;
  right: 16px;
  top: 32px;
  bottom: 0px;
}

.detail > .page {
  width: auto;
  left: 16px;
  right: 16px;
  top: 48px;
  bottom: 0px;
}

.view .content > * {
  position: absolute;
}

.view .content > .table {
  width: auto;
  left: 8px;
  right: 8px;
  top: 8px;
  bottom: 0px;
}

.table-header {
  color: #abaeaf;
  font-size: 90%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  margin: 4px 0px;
  background-color: #fff;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  padding: 2px 4px;
}

.table-header.active {
  color: #dc4f77;
}

.table-header > *:first-child {
  padding-left: 4px;
}

.table-header > *:last-child:not(.table-fixed) {
  padding-right: 4px;
}

.table-body {
  overflow-y: auto;
  outline: none;
}

.table-cell {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0px 4px;
}

.cell5 {
  width: 5%;
  box-sizing: border-box;
}

.cell7_5 {
  width: 7.5%;
  box-sizing: border-box;
}

.cell10 {
  width: 10%;
  box-sizing: border-box;
}

.cell12_5 {
  width: 12.5%;
  box-sizing: border-box;
}

.cell15 {
  width: 15%;
  box-sizing: border-box;
}

.cell20 {
  width: 20%;
  box-sizing: border-box;
}

.cell25 {
  width: 25%;
  box-sizing: border-box;
}

.cell30 {
  width: 30%;
  box-sizing: border-box;
}

.cell35 {
  width: 35%;
  box-sizing: border-box;
}

.cell40 {
  width: 40%;
  box-sizing: border-box;
}

.cell45 {
  width: 45%;
  box-sizing: border-box;
}

.cell50 {
  width: 50%;
  box-sizing: border-box;
}

.cell55 {
  width: 55%;
  box-sizing: border-box;
}

.cell60 {
  width: 60%;
  box-sizing: border-box;
}

.cell65 {
  width: 65%;
  box-sizing: border-box;
}

.cell70 {
  width: 70%;
  box-sizing: border-box;
}

.cell75 {
  width: 75%;
  box-sizing: border-box;
}

.cell80 {
  width: 80%;
  box-sizing: border-box;
}

.cell85 {
  width: 85%;
  box-sizing: border-box;
}

.cell90 {
  width: 90%;
  box-sizing: border-box;
}

.cell95 {
  width: 95%;
  box-sizing: border-box;
}

.cell100 {
  width: 100%;
  box-sizing: border-box;
}

.record-right {
  position: absolute;
  right: 0px;
  top: 2px;
}

.table-record {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  margin: 4px 0px;
  background-color: #fff;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  padding-top: 4px;
  padding-bottom: 4px;
}

.table-record.alter {
  background-color: #455D79;
  color: #fff;
}

.table-record.base {
  background-color: #012C3D;
  color: #fff;
}

.table-record.highlight {
  background-color: #F9B233;
}

.table-record.selected {
  background-color: #3480ac;
  color: #fff;
}

.table-record > *:first-child {
  padding-left: 4px;
}

.table-record > *:last-child:not(.table-fixed) {
  padding-right: 4px;
}

.table-record.pressable {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.table-record.pressable:hover {
  background-color: #b3cdf7;
}

.table-record.pressable:active {
  background-color: #85aff2;
}

.table-record-group {
  border-bottom: 1px solid #e2e5e6;
  background-color: #fff;
}

.table-record-group.selected {
  background-color: #3480ac;
  color: #fff;
}

.table-record-group.open {
  border: none;
  margin-top: -1px;
  padding-top: 1px;
  margin-bottom: 4px;
  -webkit-box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.15);
  box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.15);
}

.table-record-group > .table-record {
  border-bottom: none;
}

.detail-box {
  background-color: #fff;
  border: 1px solid #3480ac;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  padding: 8px;
}

.detail-box .title {
  font-size: 105%;
  font-weight: bold;
  color: #656565;
  margin-top: 4px;
  margin-bottom: 8px;
}

.detail > .table > .table-header {
  position: absolute;
  left: 4px;
  top: 0px;
  right: 4px;
}

.detail > .table > .table-body {
  overflow-y: auto;
  position: absolute;
  left: 0px;
  top: 19px;
  right: 0px;
  bottom: 0px;
}

.detail > .table > .table-body > * {
  margin-left: 4px;
  margin-right: 4px;
}

.table.data-table {
  font-size: 115%;
  overflow-wrap: anywhere;
}

.table-scroll.table {
  margin-right: 4px;
  overflow-x: hidden;
}

.table-scroll.table > .table-header {
  position: absolute;
  left: 0px;
  top: 0px;
  right: 0px;
}

.table-scroll.table > .table-body {
  overflow-y: auto;
  overflow-x: hidden;
  position: absolute;
  left: 0px;
  top: 19px;
  right: 0px;
  bottom: 0px;
}

.table-scroll.table > .table-horizontal-scroll {
  display: none;
  overflow-y: hidden;
  overflow-x: auto;
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 0px;
  height: 40px;
}

.table-scroll.table > .table-horizontal-scroll:after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
}

.table-scroll.table.table-extend-1 > .table-body > .table-record {
  width: 150%;
}

.table-scroll.table.table-extend-1 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table.table-extend-1 > .table-horizontal-scroll:after {
  width: 150%;
}

.table-scroll.table.table-extend-2 > .table-body > .table-record {
  width: 200%;
}

.table-scroll.table.table-extend-2 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table.table-extend-2 > .table-horizontal-scroll:after {
  width: 200%;
}

.table-scroll.table-extent-01 > .table-body > .table-record {
  width: 125%;
}

.table-scroll.table-extent-01 > .table-body > .table-record-group {
  width: 125%;
}

.table-scroll.table-extent-01 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-01 > .table-horizontal-scroll:after {
  width: 125%;
}

.table-scroll.table-extent-02 > .table-body > .table-record {
  width: 150%;
}

.table-scroll.table-extent-02 > .table-body > .table-record-group {
  width: 150%;
}

.table-scroll.table-extent-02 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-02 > .table-horizontal-scroll:after {
  width: 150%;
}

.table-scroll.table-extent-03 > .table-body > .table-record {
  width: 175%;
}

.table-scroll.table-extent-03 > .table-body > .table-record-group {
  width: 175%;
}

.table-scroll.table-extent-03 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-03 > .table-horizontal-scroll:after {
  width: 175%;
}

.table-scroll.table-extent-04 > .table-body > .table-record {
  width: 200%;
}

.table-scroll.table-extent-04 > .table-body > .table-record-group {
  width: 200%;
}

.table-scroll.table-extent-04 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-04 > .table-horizontal-scroll:after {
  width: 200%;
}

.table-scroll.table-extent-05 > .table-body > .table-record {
  width: 225%;
}

.table-scroll.table-extent-05 > .table-body > .table-record-group {
  width: 225%;
}

.table-scroll.table-extent-05 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-05 > .table-horizontal-scroll:after {
  width: 225%;
}

.table-scroll.table-extent-06 > .table-body > .table-record {
  width: 250%;
}

.table-scroll.table-extent-06 > .table-body > .table-record-group {
  width: 250%;
}

.table-scroll.table-extent-06 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-06 > .table-horizontal-scroll:after {
  width: 250%;
}

.table-scroll.table-extent-07 > .table-body > .table-record {
  width: 275%;
}

.table-scroll.table-extent-07 > .table-body > .table-record-group {
  width: 275%;
}

.table-scroll.table-extent-07 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-07 > .table-horizontal-scroll:after {
  width: 275%;
}

.table-scroll.table-extent-08 > .table-body > .table-record {
  width: 300%;
}

.table-scroll.table-extent-08 > .table-body > .table-record-group {
  width: 300%;
}

.table-scroll.table-extent-08 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-08 > .table-horizontal-scroll:after {
  width: 300%;
}

.table-scroll.table-extent-09 > .table-body > .table-record {
  width: 325%;
}

.table-scroll.table-extent-09 > .table-body > .table-record-group {
  width: 325%;
}

.table-scroll.table-extent-09 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-09 > .table-horizontal-scroll:after {
  width: 325%;
}

.table-scroll.table-extent-10 > .table-body > .table-record {
  width: 350%;
}

.table-scroll.table-extent-10 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-10 > .table-horizontal-scroll:after {
  width: 350%;
}

.table-scroll.table-extent-11 > .table-body > .table-record {
  width: 375%;
}

.table-scroll.table-extent-11 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-11 > .table-horizontal-scroll:after {
  width: 375%;
}

.table-scroll.table-extent-12 > .table-body > .table-record {
  width: 400%;
}

.table-scroll.table-extent-12 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-12 > .table-horizontal-scroll:after {
  width: 400%;
}

.table-scroll.table-extent-13 > .table-body > .table-record {
  width: 425%;
}

.table-scroll.table-extent-13 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-13 > .table-horizontal-scroll:after {
  width: 425%;
}

.table-scroll.table-extent-14 > .table-body > .table-record {
  width: 450%;
}

.table-scroll.table-extent-14 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-14 > .table-horizontal-scroll:after {
  width: 450%;
}

.table-scroll.table-extent-15 > .table-body > .table-record {
  width: 475%;
}

.table-scroll.table-extent-15 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-15 > .table-horizontal-scroll:after {
  width: 475%;
}

.table-scroll.table-extent-16 > .table-body > .table-record {
  width: 500%;
}

.table-scroll.table-extent-16 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-16 > .table-horizontal-scroll:after {
  width: 500%;
}

.table-scroll.table-extent-17 > .table-body > .table-record {
  width: 525%;
}

.table-scroll.table-extent-17 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-17 > .table-horizontal-scroll:after {
  width: 525%;
}

.table-scroll.table-extent-18 > .table-body > .table-record {
  width: 550%;
}

.table-scroll.table-extent-18 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-18 > .table-horizontal-scroll:after {
  width: 550%;
}

.table-scroll.table-extent-19 > .table-body > .table-record {
  width: 575%;
}

.table-scroll.table-extent-19 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-19 > .table-horizontal-scroll:after {
  width: 575%;
}

.table-scroll.table-extent-20 > .table-body > .table-record {
  width: 600%;
}

.table-scroll.table-extent-20 > .table-horizontal-scroll {
  display: block;
}

.table-scroll.table-extent-20 > .table-horizontal-scroll:after {
  width: 600%;
}

.table-fixed {
  position: absolute;
  top: 0px;
  height: 100%;
  z-index: 100;
}

.expandable-list {
  margin-top: 2px;
  margin-bottom: 4px;
  white-space: nowrap;
}

.expandable-list > .caption {
  display: inline;
  font-size: 80%;
  color: #fff;
  padding: 0px 3px;
  text-transform: uppercase;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.expandable-list > .caption:hover {
  background-color: #8595a1;
}

.expandable-list > .caption:active {
  background-color: #dc4f77;
  color: #fff;
}

.expandable-list > .caption::before {
  content: '\25BC';
  margin-right: 6px;
}

.expandable-list.open > .caption::before {
  content: '\25B2';
}

.fill-container {
  position: relative;
}

.fill-parent {
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  bottom: 0px;
}

.parent-bottom-right {
  position: absolute;
  right: 0px;
  bottom: 0px;
}

.fill-height {
  height: 100%;
}

.width-0 {
  width: 0;
}

.width-1 {
  width: 100%;
}

.left-1-1 {
  margin-left: 100% !important;
}

.width-1-1 {
  width: 100%;
}

.width-2 {
  width: 50%;
}

.left-2-2 {
  margin-left: 100% !important;
}

.width-2-2 {
  width: 100%;
}

.left-1-2 {
  margin-left: 50% !important;
}

.width-1-2 {
  width: 50%;
}

.width-3 {
  width: 33.33333333%;
}

.left-3-3 {
  margin-left: 100% !important;
}

.width-3-3 {
  width: 100%;
}

.left-2-3 {
  margin-left: 66.66666667% !important;
}

.width-2-3 {
  width: 66.66666667%;
}

.left-1-3 {
  margin-left: 33.33333333% !important;
}

.width-1-3 {
  width: 33.33333333%;
}

.width-4 {
  width: 25%;
}

.left-4-4 {
  margin-left: 100% !important;
}

.width-4-4 {
  width: 100%;
}

.left-3-4 {
  margin-left: 75% !important;
}

.width-3-4 {
  width: 75%;
}

.left-2-4 {
  margin-left: 50% !important;
}

.width-2-4 {
  width: 50%;
}

.left-1-4 {
  margin-left: 25% !important;
}

.width-1-4 {
  width: 25%;
}

.width-5 {
  width: 20%;
}

.left-5-5 {
  margin-left: 100% !important;
}

.width-5-5 {
  width: 100%;
}

.left-4-5 {
  margin-left: 80% !important;
}

.width-4-5 {
  width: 80%;
}

.left-3-5 {
  margin-left: 60% !important;
}

.width-3-5 {
  width: 60%;
}

.left-2-5 {
  margin-left: 40% !important;
}

.width-2-5 {
  width: 40%;
}

.left-1-5 {
  margin-left: 20% !important;
}

.width-1-5 {
  width: 20%;
}

.width-6 {
  width: 16.66666667%;
}

.left-6-6 {
  margin-left: 100% !important;
}

.width-6-6 {
  width: 100%;
}

.left-5-6 {
  margin-left: 83.33333333% !important;
}

.width-5-6 {
  width: 83.33333333%;
}

.left-4-6 {
  margin-left: 66.66666667% !important;
}

.width-4-6 {
  width: 66.66666667%;
}

.left-3-6 {
  margin-left: 50% !important;
}

.width-3-6 {
  width: 50%;
}

.left-2-6 {
  margin-left: 33.33333333% !important;
}

.width-2-6 {
  width: 33.33333333%;
}

.left-1-6 {
  margin-left: 16.66666667% !important;
}

.width-1-6 {
  width: 16.66666667%;
}

.width-7 {
  width: 14.28571429%;
}

.left-7-7 {
  margin-left: 100% !important;
}

.width-7-7 {
  width: 100%;
}

.left-6-7 {
  margin-left: 85.71428571% !important;
}

.width-6-7 {
  width: 85.71428571%;
}

.left-5-7 {
  margin-left: 71.42857143% !important;
}

.width-5-7 {
  width: 71.42857143%;
}

.left-4-7 {
  margin-left: 57.14285714% !important;
}

.width-4-7 {
  width: 57.14285714%;
}

.left-3-7 {
  margin-left: 42.85714286% !important;
}

.width-3-7 {
  width: 42.85714286%;
}

.left-2-7 {
  margin-left: 28.57142857% !important;
}

.width-2-7 {
  width: 28.57142857%;
}

.left-1-7 {
  margin-left: 14.28571429% !important;
}

.width-1-7 {
  width: 14.28571429%;
}

.width-8 {
  width: 12.5%;
}

.left-8-8 {
  margin-left: 100% !important;
}

.width-8-8 {
  width: 100%;
}

.left-7-8 {
  margin-left: 87.5% !important;
}

.width-7-8 {
  width: 87.5%;
}

.left-6-8 {
  margin-left: 75% !important;
}

.width-6-8 {
  width: 75%;
}

.left-5-8 {
  margin-left: 62.5% !important;
}

.width-5-8 {
  width: 62.5%;
}

.left-4-8 {
  margin-left: 50% !important;
}

.width-4-8 {
  width: 50%;
}

.left-3-8 {
  margin-left: 37.5% !important;
}

.width-3-8 {
  width: 37.5%;
}

.left-2-8 {
  margin-left: 25% !important;
}

.width-2-8 {
  width: 25%;
}

.left-1-8 {
  margin-left: 12.5% !important;
}

.width-1-8 {
  width: 12.5%;
}

.width-9 {
  width: 11.11111111%;
}

.left-9-9 {
  margin-left: 100% !important;
}

.width-9-9 {
  width: 100%;
}

.left-8-9 {
  margin-left: 88.88888889% !important;
}

.width-8-9 {
  width: 88.88888889%;
}

.left-7-9 {
  margin-left: 77.77777778% !important;
}

.width-7-9 {
  width: 77.77777778%;
}

.left-6-9 {
  margin-left: 66.66666667% !important;
}

.width-6-9 {
  width: 66.66666667%;
}

.left-5-9 {
  margin-left: 55.55555556% !important;
}

.width-5-9 {
  width: 55.55555556%;
}

.left-4-9 {
  margin-left: 44.44444444% !important;
}

.width-4-9 {
  width: 44.44444444%;
}

.left-3-9 {
  margin-left: 33.33333333% !important;
}

.width-3-9 {
  width: 33.33333333%;
}

.left-2-9 {
  margin-left: 22.22222222% !important;
}

.width-2-9 {
  width: 22.22222222%;
}

.left-1-9 {
  margin-left: 11.11111111% !important;
}

.width-1-9 {
  width: 11.11111111%;
}

.width-10 {
  width: 10%;
}

.left-10-10 {
  margin-left: 100% !important;
}

.width-10-10 {
  width: 100%;
}

.left-9-10 {
  margin-left: 90% !important;
}

.width-9-10 {
  width: 90%;
}

.left-8-10 {
  margin-left: 80% !important;
}

.width-8-10 {
  width: 80%;
}

.left-7-10 {
  margin-left: 70% !important;
}

.width-7-10 {
  width: 70%;
}

.left-6-10 {
  margin-left: 60% !important;
}

.width-6-10 {
  width: 60%;
}

.left-5-10 {
  margin-left: 50% !important;
}

.width-5-10 {
  width: 50%;
}

.left-4-10 {
  margin-left: 40% !important;
}

.width-4-10 {
  width: 40%;
}

.left-3-10 {
  margin-left: 30% !important;
}

.width-3-10 {
  width: 30%;
}

.left-2-10 {
  margin-left: 20% !important;
}

.width-2-10 {
  width: 20%;
}

.left-1-10 {
  margin-left: 10% !important;
}

.width-1-10 {
  width: 10%;
}

.width-11 {
  width: 9.09090909%;
}

.left-11-11 {
  margin-left: 100% !important;
}

.width-11-11 {
  width: 100%;
}

.left-10-11 {
  margin-left: 90.90909091% !important;
}

.width-10-11 {
  width: 90.90909091%;
}

.left-9-11 {
  margin-left: 81.81818182% !important;
}

.width-9-11 {
  width: 81.81818182%;
}

.left-8-11 {
  margin-left: 72.72727273% !important;
}

.width-8-11 {
  width: 72.72727273%;
}

.left-7-11 {
  margin-left: 63.63636364% !important;
}

.width-7-11 {
  width: 63.63636364%;
}

.left-6-11 {
  margin-left: 54.54545455% !important;
}

.width-6-11 {
  width: 54.54545455%;
}

.left-5-11 {
  margin-left: 45.45454545% !important;
}

.width-5-11 {
  width: 45.45454545%;
}

.left-4-11 {
  margin-left: 36.36363636% !important;
}

.width-4-11 {
  width: 36.36363636%;
}

.left-3-11 {
  margin-left: 27.27272727% !important;
}

.width-3-11 {
  width: 27.27272727%;
}

.left-2-11 {
  margin-left: 18.18181818% !important;
}

.width-2-11 {
  width: 18.18181818%;
}

.left-1-11 {
  margin-left: 9.09090909% !important;
}

.width-1-11 {
  width: 9.09090909%;
}

.width-12 {
  width: 8.33333333%;
}

.left-12-12 {
  margin-left: 100% !important;
}

.width-12-12 {
  width: 100%;
}

.left-11-12 {
  margin-left: 91.66666667% !important;
}

.width-11-12 {
  width: 91.66666667%;
}

.left-10-12 {
  margin-left: 83.33333333% !important;
}

.width-10-12 {
  width: 83.33333333%;
}

.left-9-12 {
  margin-left: 75% !important;
}

.width-9-12 {
  width: 75%;
}

.left-8-12 {
  margin-left: 66.66666667% !important;
}

.width-8-12 {
  width: 66.66666667%;
}

.left-7-12 {
  margin-left: 58.33333333% !important;
}

.width-7-12 {
  width: 58.33333333%;
}

.left-6-12 {
  margin-left: 50% !important;
}

.width-6-12 {
  width: 50%;
}

.left-5-12 {
  margin-left: 41.66666667% !important;
}

.width-5-12 {
  width: 41.66666667%;
}

.left-4-12 {
  margin-left: 33.33333333% !important;
}

.width-4-12 {
  width: 33.33333333%;
}

.left-3-12 {
  margin-left: 25% !important;
}

.width-3-12 {
  width: 25%;
}

.left-2-12 {
  margin-left: 16.66666667% !important;
}

.width-2-12 {
  width: 16.66666667%;
}

.left-1-12 {
  margin-left: 8.33333333% !important;
}

.width-1-12 {
  width: 8.33333333%;
}

.width-13 {
  width: 7.69230769%;
}

.left-13-13 {
  margin-left: 100% !important;
}

.width-13-13 {
  width: 100%;
}

.left-12-13 {
  margin-left: 92.30769231% !important;
}

.width-12-13 {
  width: 92.30769231%;
}

.left-11-13 {
  margin-left: 84.61538462% !important;
}

.width-11-13 {
  width: 84.61538462%;
}

.left-10-13 {
  margin-left: 76.92307692% !important;
}

.width-10-13 {
  width: 76.92307692%;
}

.left-9-13 {
  margin-left: 69.23076923% !important;
}

.width-9-13 {
  width: 69.23076923%;
}

.left-8-13 {
  margin-left: 61.53846154% !important;
}

.width-8-13 {
  width: 61.53846154%;
}

.left-7-13 {
  margin-left: 53.84615385% !important;
}

.width-7-13 {
  width: 53.84615385%;
}

.left-6-13 {
  margin-left: 46.15384615% !important;
}

.width-6-13 {
  width: 46.15384615%;
}

.left-5-13 {
  margin-left: 38.46153846% !important;
}

.width-5-13 {
  width: 38.46153846%;
}

.left-4-13 {
  margin-left: 30.76923077% !important;
}

.width-4-13 {
  width: 30.76923077%;
}

.left-3-13 {
  margin-left: 23.07692308% !important;
}

.width-3-13 {
  width: 23.07692308%;
}

.left-2-13 {
  margin-left: 15.38461538% !important;
}

.width-2-13 {
  width: 15.38461538%;
}

.left-1-13 {
  margin-left: 7.69230769% !important;
}

.width-1-13 {
  width: 7.69230769%;
}

.width-14 {
  width: 7.14285714%;
}

.left-14-14 {
  margin-left: 100% !important;
}

.width-14-14 {
  width: 100%;
}

.left-13-14 {
  margin-left: 92.85714286% !important;
}

.width-13-14 {
  width: 92.85714286%;
}

.left-12-14 {
  margin-left: 85.71428571% !important;
}

.width-12-14 {
  width: 85.71428571%;
}

.left-11-14 {
  margin-left: 78.57142857% !important;
}

.width-11-14 {
  width: 78.57142857%;
}

.left-10-14 {
  margin-left: 71.42857143% !important;
}

.width-10-14 {
  width: 71.42857143%;
}

.left-9-14 {
  margin-left: 64.28571429% !important;
}

.width-9-14 {
  width: 64.28571429%;
}

.left-8-14 {
  margin-left: 57.14285714% !important;
}

.width-8-14 {
  width: 57.14285714%;
}

.left-7-14 {
  margin-left: 50% !important;
}

.width-7-14 {
  width: 50%;
}

.left-6-14 {
  margin-left: 42.85714286% !important;
}

.width-6-14 {
  width: 42.85714286%;
}

.left-5-14 {
  margin-left: 35.71428571% !important;
}

.width-5-14 {
  width: 35.71428571%;
}

.left-4-14 {
  margin-left: 28.57142857% !important;
}

.width-4-14 {
  width: 28.57142857%;
}

.left-3-14 {
  margin-left: 21.42857143% !important;
}

.width-3-14 {
  width: 21.42857143%;
}

.left-2-14 {
  margin-left: 14.28571429% !important;
}

.width-2-14 {
  width: 14.28571429%;
}

.left-1-14 {
  margin-left: 7.14285714% !important;
}

.width-1-14 {
  width: 7.14285714%;
}

.width-15 {
  width: 6.66666667%;
}

.left-15-15 {
  margin-left: 100% !important;
}

.width-15-15 {
  width: 100%;
}

.left-14-15 {
  margin-left: 93.33333333% !important;
}

.width-14-15 {
  width: 93.33333333%;
}

.left-13-15 {
  margin-left: 86.66666667% !important;
}

.width-13-15 {
  width: 86.66666667%;
}

.left-12-15 {
  margin-left: 80% !important;
}

.width-12-15 {
  width: 80%;
}

.left-11-15 {
  margin-left: 73.33333333% !important;
}

.width-11-15 {
  width: 73.33333333%;
}

.left-10-15 {
  margin-left: 66.66666667% !important;
}

.width-10-15 {
  width: 66.66666667%;
}

.left-9-15 {
  margin-left: 60% !important;
}

.width-9-15 {
  width: 60%;
}

.left-8-15 {
  margin-left: 53.33333333% !important;
}

.width-8-15 {
  width: 53.33333333%;
}

.left-7-15 {
  margin-left: 46.66666667% !important;
}

.width-7-15 {
  width: 46.66666667%;
}

.left-6-15 {
  margin-left: 40% !important;
}

.width-6-15 {
  width: 40%;
}

.left-5-15 {
  margin-left: 33.33333333% !important;
}

.width-5-15 {
  width: 33.33333333%;
}

.left-4-15 {
  margin-left: 26.66666667% !important;
}

.width-4-15 {
  width: 26.66666667%;
}

.left-3-15 {
  margin-left: 20% !important;
}

.width-3-15 {
  width: 20%;
}

.left-2-15 {
  margin-left: 13.33333333% !important;
}

.width-2-15 {
  width: 13.33333333%;
}

.left-1-15 {
  margin-left: 6.66666667% !important;
}

.width-1-15 {
  width: 6.66666667%;
}

.width-16 {
  width: 6.25%;
}

.left-16-16 {
  margin-left: 100% !important;
}

.width-16-16 {
  width: 100%;
}

.left-15-16 {
  margin-left: 93.75% !important;
}

.width-15-16 {
  width: 93.75%;
}

.left-14-16 {
  margin-left: 87.5% !important;
}

.width-14-16 {
  width: 87.5%;
}

.left-13-16 {
  margin-left: 81.25% !important;
}

.width-13-16 {
  width: 81.25%;
}

.left-12-16 {
  margin-left: 75% !important;
}

.width-12-16 {
  width: 75%;
}

.left-11-16 {
  margin-left: 68.75% !important;
}

.width-11-16 {
  width: 68.75%;
}

.left-10-16 {
  margin-left: 62.5% !important;
}

.width-10-16 {
  width: 62.5%;
}

.left-9-16 {
  margin-left: 56.25% !important;
}

.width-9-16 {
  width: 56.25%;
}

.left-8-16 {
  margin-left: 50% !important;
}

.width-8-16 {
  width: 50%;
}

.left-7-16 {
  margin-left: 43.75% !important;
}

.width-7-16 {
  width: 43.75%;
}

.left-6-16 {
  margin-left: 37.5% !important;
}

.width-6-16 {
  width: 37.5%;
}

.left-5-16 {
  margin-left: 31.25% !important;
}

.width-5-16 {
  width: 31.25%;
}

.left-4-16 {
  margin-left: 25% !important;
}

.width-4-16 {
  width: 25%;
}

.left-3-16 {
  margin-left: 18.75% !important;
}

.width-3-16 {
  width: 18.75%;
}

.left-2-16 {
  margin-left: 12.5% !important;
}

.width-2-16 {
  width: 12.5%;
}

.left-1-16 {
  margin-left: 6.25% !important;
}

.width-1-16 {
  width: 6.25%;
}

.hidden-item-1 {
  opacity: 0;
}

.hidden-item-1.faded {
  opacity: 0.5;
}

.hidden-container-1:hover .hidden-item-1 {
  opacity: 1;
}

.hidden-item-2 {
  opacity: 0;
}

.hidden-item-2.faded {
  opacity: 0.5;
}

.hidden-container-2:hover .hidden-item-2 {
  opacity: 1;
}

.hidden-item-3 {
  opacity: 0;
}

.hidden-item-3.faded {
  opacity: 0.5;
}

.hidden-container-3:hover .hidden-item-3 {
  opacity: 1;
}

.hidden-item-4 {
  opacity: 0;
}

.hidden-item-4.faded {
  opacity: 0.5;
}

.hidden-container-4:hover .hidden-item-4 {
  opacity: 1;
}

.hover-text-box {
  position: relative;
  height: 100%;
  width: 100%;
}

.hover-text-box > * {
  position: absolute;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  overflow: hidden;
  background-color: #fff;
  padding: 1px 4px;
}

.hover-text-box:hover > * {
  bottom: auto;
  z-index: 1000;
  padding: 0px 3px;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.dropdown {
  display: inline-block;
  position: relative;
  cursor: pointer;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.dropdown .dropdown-menu {
  display: none;
  position: absolute;
  z-index: 1000;
  top: 100%;
  min-width: 100%;
  background-color: #fff;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.dropdown.open .dropdown-menu {
  display: block;
}

.modal-dialog {
  background-color: #fff;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}

.display-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.display-line > div:not(:last-child) {
  margin-right: 3px;
}

.display-line > div:last-child:not(:first-child) {
  text-align: right;
}

.popup-container {
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  bottom: 0px;
  display: flex;
  flex-direction: column;
  margin: 30px;
}

.popup {
  height: auto;
  margin: 0 auto;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  overflow: visible;
  z-index: 100;
  background-color: #fff;
  color: #012C3D;
}

.popup > .header {
  margin: 16px !important;
  margin: 15px !important;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  -webkit-border-top-left-radius: 8px;
  -webkit-border-top-right-radius: 8px;
  -moz-border-radius-topleft: 8px;
  -moz-border-radius-topright: 8px;
  padding: 4px;
  text-align: center;
}

.popup.large {
  height: 100%;
  min-width: 60%;
}

.view:not(.popup) .dialog-action {
  display: none;
}

table.table-rows {
  border-collapse: separate;
  border-spacing: 0 8px;
  width: 98%;
}

table.table-rows tr {
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

table.table-rows tr td {
  padding: 2px;
}

table {
  border-collapse: separate;
  border-spacing: 0;
}

table td,
table th {
  vertical-align: top;
}

table.padded td,
table.padded th {
  padding: 4px 6px;
}

table.row-hover tr:hover {
  background-color: #e2e5e6;
}

table.align-baseline tr > td {
  vertical-align: baseline;
}

table tr.align-baseline > td {
  vertical-align: baseline;
}

table.data-table {
  font-size: 115%;
  overflow-wrap: anywhere;
}

th,
td {
  text-align: left;
}

table.row-borders td,
table.borders td,
table.row-borders th,
table.borders th {
  border-bottom: 1px solid #e2e5e6;
}

table.column-borders td:not(:first-child),
table.borders td:not(:first-child),
table.column-borders th:not(:first-child),
table.borders th:not(:first-child) {
  border-left: 1px solid #e2e5e6;
}

/*
  Plate
 */

.plate {
  box-sizing: border-box;
  margin: 4px;
  background-color: #fff;
  padding: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: -1px 1px 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: -1px 1px 1px 1px rgba(0, 0, 0, 0.05);
}

.plate.selectable {
  cursor: pointer;
}

.plate.flat {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.plate .title {
  color: #012C3D;
  font-weight: bold;
}

.plate .title.large {
  font-size: 120%;
}

.plate .label {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #455D79;
  color: #fff;
  padding-left: 4px !important;
  padding-left: 5px !important;
  padding-right: 4px !important;
  padding-right: 5px !important;
}

.plate.selected {
  background-color: #455D79;
  color: #fff;
}

.plate.selected .label {
  background-color: #fff;
  color: #012C3D;
}

.card {
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 4px 12px;
}

.card > .header {
  font-weight: bold;
  border-bottom: 1px solid #e2e5e6;
}

.dialog-container {
  padding: 12px;
}

.dialog-container > .header {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin-left: 16px;
  font-size: 105%;
  font-weight: bold;
}

.border-box {
  box-sizing: border-box;
}

.label {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding-left: 4px !important;
  padding-left: 5px !important;
  padding-right: 4px !important;
  padding-right: 5px !important;
}

.hidden-action {
  opacity: 0;
  color: #455D79;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.faded-action {
  opacity: 0.2;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.hidden-action-container.faded-action:hover:not(.readonly),
.hidden-action-container:hover .faded-action:not(.readonly),
.faded-action-container.faded-action:hover:not(.readonly),
.faded-action-container:hover .faded-action:not(.readonly) {
  opacity: 1;
}

.btn,
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
  outline-style: none;
}

.hidden-action-container.hidden-action:hover,
.hidden-action-container:hover .hidden-action {
  opacity: 1;
}

.hidden-action:hover {
  color: #587699;
}

.hidden-action:active {
  color: #3c5169;
}

.hidden-action.disabled {
  color: #f5f5f5;
}

.action-button {
  color: #455D79;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.action-button.small {
  font-size: 80%;
}

.action-button.red {
  color: #ca5a5e;
}

.action-button.light {
  opacity: 0.3;
}

.action-button:hover {
  color: #587699;
}

.action-button:hover.red {
  color: #c1323c;
}

.action-button:hover.light {
  opacity: 1;
}

.action-button:active {
  color: #3c5169;
}

.action-button:active.red {
  color: #a82a33;
}

.action-button:active.light {
  opacity: 1;
}

.action-button.active {
  color: #dc4f77;
}

.action-button.disabled {
  color: #ccc;
}

.action-box {
  background-color: #455D79;
  color: #fff;
  cursor: pointer;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.action-box.small {
  font-size: 80%;
}

.action-box.red {
  background-color: #ca5a5e;
}

.action-box.light {
  opacity: 0.3;
}

.action-box:hover {
  background-color: #587699;
}

.action-box:hover.red {
  background-color: #c1323c;
}

.action-box:hover.light {
  opacity: 1;
}

.action-box:active {
  background-color: #3c5169;
}

.action-box:active.red {
  background-color: #a82a33;
}

.action-box:active.light {
  opacity: 1;
}

.select2-container {
  z-index: 10000;
}

.select2-selection {
  outline: 0;
}

.clickable {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.user-select-none {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.link {
  cursor: pointer;
  color: #012C3D;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.link.light {
  color: #1c65cb;
}

.link:hover {
  color: #028ac2;
  text-decoration: none;
}

a.link {
  text-decoration: none;
}

.tooltip-container {
  position: relative;
}

.tooltip-box {
  display: none;
  position: absolute;
  padding: 6px;
  z-index: 1000;
  margin-top: 4px;
  top: 100%;
  background-color: #fffff8;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #999;
  color: #444;
  white-space: nowrap;
}

.tooltip-container:hover .tooltip-box {
  display: block;
}

.progress-frame {
  position: relative;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #666;
  height: 12px;
}

.progress-fill {
  position: absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
  background: #7d5eff;
}

.tool-select {
  margin-left: 8px;
  margin-right: 8px;
}

.tool-item {
  display: inline-block;
  vertical-align: top;
  color: #012C3D;
  font-size: 85%;
  background-color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding-left: 4px;
  padding-right: 4px;
}

.tool-item-caption {
  font-weight: bold;
  padding-bottom: 2px;
  white-space: nowrap;
}

.action-item {
  display: inline-block;
  vertical-align: top;
  background-color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #b4b4b4;
  min-width: 20px;
  height: 50px;
}

.sort-tag {
  display: inline;
  color: #aaa;
  font-size: 80%;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.sort-tag.active {
  color: #555;
}

.sort-tag:after {
  font-family: 'glyphs' !important;
  vertical-align: sub;
}

.sort-tag.asc-1:after {
  content: "\f021";
}

.sort-tag.asc-2:after {
  content: "\f022";
}

.sort-tag.asc-3:after {
  content: "\f023";
}

.sort-tag.asc-4:after {
  content: "\f024";
}

.sort-tag.desc-1:after {
  content: "\f011";
}

.sort-tag.desc-2:after {
  content: "\f012";
}

.sort-tag.desc-3:after {
  content: "\f013";
}

.sort-tag.desc-4:after {
  content: "\f014";
}

.selectex {
  position: relative;
  color: #7f7f7f;
  outline: none;
  background-color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #b4b4b4;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  padding: 4px 7px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.selectex .list {
  max-height: 200px;
  overflow-y: auto;
}

.selectex.open {
  border-bottom-left-radius: 0px;
  -webkit-border-bottom-left-radius: 0px;
  -moz-border-radius-bottomleft: 0px;
  border-bottom-right-radius: 0px;
  -webkit-border-bottom-right-radius: 0px;
  -moz-border-radius-bottomright: 0px;
}

.selectex:before {
  content: '\2bc6';
  font-size: 85%;
  float: right;
  margin-top: 2px;
}

.selectex.link {
  border: 1px solid transparent;
  color: #1c65cb;
}

.selectex.link:before {
  content: '';
}

.selectex.link.disabled {
  color: #d7d7d7;
}

.selectex.open:before {
  content: '\2bc5';
}

.selectex.disabled:not(.link) {
  border: 1px solid #d7d7d7;
  background-color: #eee;
  color: #b4b4b4;
}

.selectex:invalid {
  border-color: red;
}

.selectex.invalid {
  border-color: red;
}

.selectex .drop-down {
  position: absolute;
  z-index: 1000;
  left: -1px;
  right: -1px;
  top: 100%;
  border: 1px solid #b4b4b4;
  color: #012C3D;
  background-color: #fff;
  border-bottom-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  border-bottom-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  border-top: none;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  padding: 2px 0px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.selectex .drop-down .search {
  width: 100%;
  padding: 0px 2px;
  margin-bottom: 2px;
}

.selectex .drop-down .search input {
  width: 100%;
}

.selectex .drop-down .option {
  padding: 1px 4px;
}

.selectex .drop-down .option.selected {
  background-color: #1866ba;
  color: #fff;
}

.selectex .drop-down .option:hover {
  background-color: #1e90ff;
  color: #fff;
}

.selectex:focus:not(.link):not(.disabled) {
  border: 1px solid #5d9cec;
  color: #012C3D;
}

.selectex.open {
  border: 1px solid #5d9cec;
  color: #012C3D;
}

.selectex.open .drop-down {
  border: 1px solid #5d9cec;
  color: #012C3D;
}

.selectex.text-sm {
  padding: 2px 4px;
}

select {
  color: #012C3D;
  outline: none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #e2e5e6;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  padding-right: 3px;
  padding-top: 1px;
  padding-bottom: 1px;
}

select:focus {
  border: 1px solid #455D79;
  color: #012C3D;
}

select:disabled {
  border: 1px solid #e2e5e6;
  background-color: #f5f5f5;
  color: #d1d4d5;
}

select:invalid {
  border-color: #f05050;
}

input {
  color: #012C3D;
  outline: none;
}

input.small {
  font-size: 85%;
}

input::placeholder {
  color: #e2e5e6;
}

input::-ms-input-placeholder {
  color: #e2e5e6;
}

input[type="text"] {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #e2e5e6;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 1px;
  text-indent: 4px;
}

input[type="text"].text-sm,
input[type="text"].small {
  padding-top: 2px;
  padding-bottom: 2px;
}

input[type="text"]:focus {
  border: 1px solid #455D79;
  color: #012C3D;
}

input[type="text"]:disabled {
  border: 1px solid #e2e5e6;
  background-color: #f5f5f5;
  color: #d1d4d5;
}

input[type="text"]:invalid {
  border-color: #f05050;
}

input[type="text"].invalid {
  border-color: #f05050;
}

input[type="text"].error {
  border: 1px solid #f05050;
  color: #012C3D;
}

input[type="password"] {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #e2e5e6;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 1px;
  text-indent: 4px;
}

input[type="password"].text-sm,
input[type="password"].small {
  padding-top: 2px;
  padding-bottom: 2px;
}

input[type="password"]:focus {
  border: 1px solid #455D79;
  color: #012C3D;
}

input[type="password"]:disabled {
  border: 1px solid #e2e5e6;
  background-color: #f5f5f5;
  color: #d1d4d5;
}

input[type="password"]:invalid {
  border-color: #f05050;
}

input[type="password"].invalid {
  border-color: #f05050;
}

input[type="password"].error {
  border: 1px solid #f05050;
  color: #012C3D;
}

input.search {
  background-color: #f5f5f5;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px;
  border: none;
  padding: 4px 8px;
  color: #012C3D;
}

input.search::placeholder {
  color: #455D79;
}

input.search:focus {
  border: none;
}

input.quick-search {
  border: 2px solid #455D79;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px;
  padding: 4px 4px 3.5px 4px;
  color: #012C3D;
  font-size: 14px;
  text-indent: 8px;
}

input.quick-search::placeholder {
  color: #455D79;
}

input.quick-search:focus {
  border: 2px solid #012C3D;
}

.datetime {
  display: inline-block;
  outline: none;
  overflow-x: hidden;
}

.datetime .datetime-part {
  display: inline-block;
  position: relative;
  min-width: 4em;
  width: 100%;
}

.datetime .datetime-part.has-button input {
  padding-right: 0.5em;
}

.datetime .datetime-part .edit-button {
  position: absolute;
  right: 4px;
  top: 4px;
  color: #b4b4b4;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.datetime .datetime-part .edit-button:hover {
  color: #012C3D;
}

.datetime .datetime-part .edit-button:active {
  color: #888888;
}

.datetime .datetime-part .top {
  top: 3px;
  font-size: 70%;
}

.datetime .datetime-part .bottom {
  top: 13px;
  font-size: 70%;
}

.field .datetime .top {
  top: -2px;
}

.field .datetime .bottom {
  top: 8px;
}

button,
button:focus,
button:active:focus,
button.active:focus,
button.focus,
button:active.focus,
button.active.focus {
  outline-style: none;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  padding: 4px 22px;
  background-color: transparent;
}

button.rounder,
button:focus.rounder,
button:active:focus.rounder,
button.active:focus.rounder,
button.focus.rounder,
button:active.focus.rounder,
button.active.focus.rounder {
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  border-radius: 12px;
}

button.small,
button:focus.small,
button:active:focus.small,
button.active:focus.small,
button.focus.small,
button:active.focus.small,
button.active.focus.small {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-size: 85%;
  padding: 2px 8px;
}

button.tiny,
button:focus.tiny,
button:active:focus.tiny,
button.active:focus.tiny,
button.focus.tiny,
button:active.focus.tiny,
button.active.focus.tiny {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-size: 75%;
  padding: 1px 5px;
}

button {
  border: 1px solid #012C3D;
  color: #012C3D;
}

button:focus,
button.focus,
button.active {
  border: 1px solid #013e56;
  color: #013e56;
}

button:hover {
  border: 1px solid #0374a1;
  color: #0374a1;
}

button:active {
  border: 1px solid #02506f;
  color: #02506f;
}

button.highlight-full {
  border: 1px solid #F9B233;
  color: #fff;
  background-color: #F9B233;
}

button.highlight-full:focus,
button.highlight-full.focus,
button.highlight-full.active {
  border: 1px solid #f29e07;
  background-color: #fabb4c;
}

button.highlight-full:hover {
  background-color: #fac565;
}

button.highlight-full:active {
  background-color: #f29e07;
}

button.danger {
  border: 1px solid #f05050;
  color: #f05050;
}

button.danger:focus,
button.danger.focus,
button.danger.active {
  border: 1px solid #f26767;
  color: #f26767;
}

button.danger:hover {
  border: 1px solid #f8aeae;
  color: #f8aeae;
}

button.danger:active {
  border: 1px solid #f47f7f;
  color: #f47f7f;
}

button.danger-full {
  border: 1px solid #f05050;
  color: #fff;
  background-color: #f05050;
}

button.danger-full:focus,
button.danger-full.focus,
button.danger-full.active {
  border: 1px solid #ec2121;
  background-color: #f26767;
}

button.danger-full:hover {
  background-color: #f47f7f;
}

button.danger-full:active {
  background-color: #ec2121;
}

button:disabled {
  background-color: #d1d4d5;
  border: 1px solid #8595a1;
  color: #8595a1;
}

.calendar {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #b4b4b4;
  outline-style: none;
  min-width: 240px;
}

.calendar:focus {
  border: 1px solid #5d9cec;
  color: #012C3D;
}

.calendar:disabled {
  border: 1px solid #d7d7d7;
  background-color: #eee;
  color: #b4b4b4;
}

.calendar.invalid {
  border-color: red;
}

.calendar .month-header {
  padding: 2px;
  text-align: center;
  color: #2192ca;
}

.calendar .day-header {
  border-top: 1px solid #b4b4b4;
  width: 14.28571429%;
  text-align: center;
  padding: 2px;
}

.calendar .day-header:not(:first-child) {
  border-left: 1px solid #b4b4b4;
}

.calendar .day {
  border-top: 1px solid #b4b4b4;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 14.28571429%;
  text-align: center;
  padding: 2px;
}

.calendar .day:not(:first-child) {
  border-left: 1px solid #b4b4b4;
}

.calendar .day.muted:not(.active) {
  background-color: #edf1f2;
}

.calendar .day.disabled {
  color: #b4b4b4;
}

.calendar .day.active {
  background-color: #5d9cec;
  color: #fff;
}

.calendar .quarter {
  border-top: 1px solid #b4b4b4;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 14.28571429%;
  text-align: center;
  padding: 2px;
  border-left: 1px solid #b4b4b4;
}

.calendar .quarter.muted:not(.active) {
  background-color: #edf1f2;
}

.calendar .quarter.disabled {
  color: #b4b4b4;
}

.calendar .quarter.active {
  background-color: #5d9cec;
  color: #fff;
}

.label-button {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline;
  margin-left: 6px;
  padding-left: 4px;
}

.label-button:hover {
  color: #fff;
}

.label-primary .label-button {
  color: #62abff;
  border-left: 1px solid #62abff;
}

.label-success .label-button {
  color: #55e075;
  border-left: 1px solid #55e075;
}

.label-info .label-button {
  color: #5fd4fa;
  border-left: 1px solid #5fd4fa;
}

.label-warning.label-button {
  color: #ffb43e;
  border-left: 1px solid #ffb43e;
}

.label-danger .label-button {
  color: #ff7976;
  border-left: 1px solid #ff7976;
}

.label-button:hover {
  color: #fff;
}

.label-button:active {
  color: #666;
}

.selectable {
  cursor: pointer;
}

.pane-select {
  display: inline-block;
  margin-top: 6px;
  margin-bottom: 6px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  background-color: #d1d4d5;
}

.pane-select .pane {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
  position: relative;
  cursor: pointer;
  min-width: 80px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
}

.pane-select .pane .caption {
  padding: 6px 14px;
  text-align: center;
  color: #8595a1;
}

.pane-select .pane.active {
  background-color: #fff;
  -webkit-box-shadow: 2px 1px 4px 2px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 2px 1px 4px 2px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 1px 4px 2px rgba(0, 0, 0, 0.1);
}

.pane-select .pane.active .caption {
  color: #012C3D;
  font-weight: bold;
}

.pane-select .pane .marker {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  display: none;
  position: absolute;
  left: 4px;
  top: 4px;
  bottom: 4px;
  width: 4px;
  background-color: #F9B233;
}

.pane-select .pane.active .marker {
  display: block;
}

.action {
  background-color: transparent;
  outline-style: none;
  border-style: none;
  color: #8595a1;
  cursor: pointer;
  display: inline-block;
  margin: 0px 4px;
}

.action:hover {
  color: #e47a98;
}

.action:active {
  color: #dc4f77;
}

.action:disabled {
  color: #d1d4d5;
}

.circle-button {
  display: inline-block;
  background-color: #dc4f77;
  text-align: center;
  color: #fff;
  width: 32px;
  height: 32px;
  margin: -4px 8px;
  padding: 7px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px;
  -webkit-box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.8);
  box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.8);
}

.circle-button.small {
  width: 20px;
  height: 20px;
  margin: -2px 4px;
  padding: 2px;
  font-size: 90%;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  -webkit-box-shadow: 0px 1px 1px 0.5px rgba(0, 0, 0, 0.8);
  box-shadow: 0px 1px 1px 0.5px rgba(0, 0, 0, 0.8);
}

.circle-button:hover {
  background-color: #cf2958;
}

.circle-button:active {
  background-color: #dc4f77;
}

.radio-item {
  background-color: transparent;
  outline-style: none;
  border-style: none;
  color: #8595a1;
  cursor: pointer;
  display: inline-block;
  margin: 3px 2px;
  font-size: 110%;
}

.radio-item.light {
  color: #fff;
}

.radio-item.small {
  font-size: 90%;
}

.radio-item:hover:not(.readonly) {
  color: #6a7c89;
}

.radio-item:active:not(.readonly),
.radio-item.active {
  color: #F9B233;
}

.radio-item:disabled {
  color: #d1d4d5;
}

.radio-group {
  display: inline-block;
}

.radio-group.small > .radio-item {
  font-size: 80%;
}

.radio-group.medium > .radio-item {
  font-size: 90%;
}

.radio-group.large > .radio-item {
  font-size: 110%;
}

.radio-group .radio-item:not(:first-child) {
  padding-left: 3px;
  border-left: 1px solid #ffddd8;
}

.radio-item.medium {
  font-size: 90%;
}

.radio-item.large {
  font-size: 125%;
}

.list-item {
  background-color: transparent;
  outline-style: none;
  border-style: none;
  color: #8595a1;
  cursor: pointer;
  display: block;
  width: 100%;
  margin: 3px 2px;
}

.list-item.light {
  color: #fff;
}

.list-item.small {
  font-size: 90%;
}

.list-item:hover {
  color: #e47a98;
}

.list-item:active,
.list-item.active {
  color: #dc4f77;
}

.list-item:disabled {
  color: #d1d4d5;
}

@keyframes loader {
  from {
    background-color: #455D79;
  }

  80% {
    background-color: rgba(69, 93, 121, 0);
  }

  to {
    background-color: #455D79;
  }
}

.loader > div {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 3px;
  margin: 2px;
  border: 1px solid #455D79;
  animation-name: loader;
  animation-duration: 1600ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.loader.small > div {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  margin: 1px;
}

.loader > div:nth-child(2) {
  animation-delay: 200ms;
}

.loader > div:nth-child(3) {
  animation-delay: 400ms;
}

.loader > div:nth-child(4) {
  animation-delay: 600ms;
}

.loader > div:nth-child(5) {
  animation-delay: 800ms;
}

.loader > div:nth-child(6) {
  animation-delay: 1000ms;
}

.loader > div:nth-child(7) {
  animation-delay: 1200ms;
}

.loader > div:nth-child(7) {
  animation-delay: 1400ms;
}

.switch {
  display: inline-block;
  width: 16px;
  height: 8px;
  position: relative;
  background-color: #8595a1;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.switch::after {
  position: absolute;
  content: '\200b';
  padding-left: 3px;
  padding-right: 3px;
  font-size: 6px;
  line-height: 1;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: #fff;
  top: 1px;
  right: 1px;
}

.switch.active {
  background-color: #dc4f77;
}

.switch.active::after {
  right: auto;
  left: 1px;
}

.view-bar select,
select.lookup {
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  outline-style: none;
  background: transparent;
}

.view-bar select.tall,
select.lookup.tall {
  padding-top: 5px;
  padding-bottom: 4px;
}

.details-expander {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #028ac2;
  color: #028ac2;
  cursor: pointer;
  line-height: 1;
  padding: 0px 8px;
}

.details-expander.active {
  background-color: #028ac2;
  color: #fff;
}

.details-expander:hover {
  border: 1px solid #455D79;
  color: #455D79;
}

.border-bottom {
  border-bottom: 1px solid #e2e5e6;
}

.border-top {
  border-top: 1px solid #e2e5e6;
}

.border-left {
  border-left: 1px solid #e2e5e6;
}

.border-right {
  border-right: 1px solid #e2e5e6;
}

.tool-button {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  align-items: center;
  background-color: #f5f5f5;
  padding: 6px;
  font-size: 14px;
  height: 26px;
  min-width: 26px;
  text-align: center;
  white-space: nowrap;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  color: #012C3D;
  -webkit-box-shadow: 2px 1px 4px 2px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 2px 1px 4px 2px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 1px 4px 2px rgba(0, 0, 0, 0.1);
}

.tool-button:hover {
  color: #455D79;
}

.tool-button:active {
  background-color: #dcdcdc;
  color: #324459;
}

.tool-button.active {
  color: #F9B233;
}

.tool-button:disabled,
.tool-button[disabled] {
  pointer-events: none;
  color: #d1d4d5;
}

/*
  Action
 */

.action {
  background-color: transparent;
  outline-style: none;
  border-style: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  text-align: center;
  color: #455D79;
  padding: 2px;
  display: inline;
  font-size: 12px;
  margin: 0;
}

.action.large {
  font-size: 16px;
}

.action .action-glyphs {
  display: inline-block;
  width: 1em;
  font-size: 115%;
}

.action .action-hover-glyph {
  display: none;
}

.action .action-text {
  padding-left: 0.2em;
}

.action:hover {
  color: #587699;
}

.action:hover.hoverglyph .action-hover-glyph {
  display: inline;
}

.action:hover.hoverglyph .action-glyph {
  display: none;
}

.action:active {
  color: #425873;
}

.selected .action {
  color: #fff;
}

.selected .action:hover {
  color: #b5c4d5;
}

.selected .action:active {
  color: #7490b0;
}

/*
  Round button
 */

.round-button {
  width: 18px;
  height: 18px;
  text-align: center;
  border-radius: 0.7em;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 4px;
  line-height: 1.5;
  background-color: #fff;
  color: #012C3D;
  -webkit-box-shadow: 1px 0.5px 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 0.5px 1px 1px rgba(0, 0, 0, 0.05);
}

.round-button:hover {
  background-color: #F9B233;
}

.round-button:active {
  background-color: #455D79;
  color: #fff;
}

.round-button.medium {
  width: 30px;
  height: 30px;
  padding: 6px;
  border-radius: 30px;
  font-size: 125%;
  line-height: 2;
}

.glyph-select {
  display: inline;
}

.glyph-select > * {
  display: inline;
}

.glyph-select > .hover {
  display: none;
}

.glyph-select:hover > * {
  display: none;
}

.glyph-select:hover > .hover {
  display: inline;
}

.action:hover .glyph-select > *,
.tool-button:hover .glyph-select > * {
  display: none;
}

.action:hover .glyph-select > .hover,
.tool-button:hover .glyph-select > .hover {
  display: inline;
}

.size-mark {
  cursor: pointer;
  display: inline-block;
  margin-right: 2px;
  width: 8px;
  height: 14px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #8595a1;
}

.size-mark:hover {
  background-color: #6a7c89;
}

.size-mark.active {
  background-color: #F9B233;
}

.size-mark.active:hover {
  background-color: #f29e07;
}

.control-pressed .linked:hover input,
.control-pressed .linked:hover .static {
  cursor: pointer;
  color: #028ac2;
}

.red-alert {
  animation: blink 1.3s linear infinite;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background-color: #f05050;
  width: 10px;
  height: 10px;
}

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

  40% {
    opacity: 1;
  }

  55% {
    opacity: 0;
  }

  95% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.time-frame-select {
  color: #012C3D;
  margin: 1px 3px;
  display: inline-block;
  position: relative;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.time-frame-select .time-frame-range {
  display: inline-block;
  cursor: pointer;
  padding: 1px 8px 2px 8px;
  border-radius: 22px;
  margin-left: 8px;
  border: 1px solid #012C3D;
}

.time-frame-select .time-frame-popup {
  position: absolute;
  right: 0px;
  top: 100%;
  z-index: 1000;
  padding: 8px;
  background-color: #fff;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  color: #2a2a2a;
}

.time-frame-select .time-frame-popup td {
  vertical-align: top;
}

.time-frame-select .time-frame-popup .title {
  font-size: 80%;
}

.time-frame-select .time-frame-popup .time-frame-panel {
  border: 1px solid #5d9cec;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  margin-bottom: 4px;
  padding-top: 6px;
  padding-right: 6px;
  padding-left: 6px;
}

.time-frame-select .time-frame-popup .time-frame-part {
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.time-frame-select .time-frame-popup .time-frame-part .title {
  font-size: 80%;
  font-weight: bold;
  color: #999;
}

.time-frame-select .time-frame-popup .time-frame-part.active {
  background-color: #5d9cec;
  color: #fff;
}

.time-frame-select .time-frame-popup .time-frame-part.active .title {
  color: #ddd;
}

.time-frame-select .time-frame-popup .shortcut-list {
  border-top: 1px solid #ddd;
  margin-top: 6px;
  padding-top: 6px;
}

.time-frame-select .time-frame-popup .shortcut {
  display: inline-block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  padding-left: 4px;
  padding-right: 4px;
  border-left: 1px solid #ddd;
}

.time-frame-select .time-frame-popup .shortcut:last-child {
  border-right: 1px solid #ddd;
}

.route {
  display: inline-block;
  outline: none;
  position: relative;
}

.route .route-items {
  display: inline-block;
  cursor: pointer;
  padding: 1px 8px 2px 8px;
  border-radius: 22px;
  border: 1px solid #012C3D;
}

.route .route-item {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline;
  color: #455D79;
}

.route .route-item:hover {
  color: #F9B233;
}

.route .route-item:active {
  color: #d98e06;
}

.route .route-item:last-child {
  font-weight: bold;
  color: #012C3D;
}

.route .route-item:last-child:hover {
  color: #02506f;
}

.route .route-item:last-child:active {
  color: #013e56;
}

.route .route-item:last-child:after {
  content: '\2bc6';
  font-size: 85%;
}

.route .route-item:not(:last-child):after {
  content: '\00B7';
  margin-left: 2px;
  margin-right: 2px;
}

.route.open .route-item:last-child:after {
  content: '\2bc5';
}

.route .drop-down {
  position: absolute;
  z-index: 1000;
  left: -1px;
  top: 100%;
  min-width: 100%;
  color: #012C3D;
  background-color: #fff;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  max-height: 252px;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  padding: 2px 0px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.route .drop-down .list {
  max-height: 200px;
  overflow-y: auto;
}

.route .drop-down .option {
  padding: 1px 4px;
  white-space: nowrap;
}

.route .drop-down .option.highlight {
  background-color: #1866ba;
  color: #fff;
}

.route .drop-down .option:hover {
  background-color: #1e90ff;
  color: #fff;
}

.radial {
  display: inline-block;
  position: relative;
  text-align: center;
  min-width: 50px;
  min-height: 50px;
  width: 100%;
  height: 100%;
}

.radial > .graphic {
  position: absolute;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: #fafafa;
}

.radial > .graphic > .content {
  position: absolute;
  left: 8px;
  top: 8px;
  right: 8px;
  bottom: 8px;
  text-align: center;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.radial.wide > .graphic > .content {
  left: 12px;
  top: 12px;
  right: 12px;
  bottom: 12px;
}

.bar-chart {
  width: 100%;
  height: 100%;
}

.line-chart {
  width: 100%;
  height: 100%;
}

.dots-chart {
  width: 100%;
  height: 100%;
}

.pie-chart {
  text-align: center;
}

.pie-chart:not(.scaled) {
  height: 72px;
}

.pie-chart:not(.scaled) > svg {
  width: 72px;
}

.progressbar {
  height: 16px;
  width: 100%;
}

.progressbar.small {
  height: 8px;
}

.chart {
  position: relative;
  width: 100%;
  height: 72px;
}

.chart .legend {
  min-width: 60px;
}

.chart .legend .legend-item {
  padding: 1px 6px;
  width: 100%;
}

.chart .bar-chart {
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
}

.chart .line-chart {
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
}

.chart .dots-chart {
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
}

.chart .progressbar {
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
}

.chart .hint {
  position: absolute;
  width: auto;
  z-index: 1000;
  white-space: nowrap;
  text-align: center;
}

.chart .hint > div {
  background-color: #4d4256;
  border-radius: 6px;
  padding: 1px 4px;
  color: #fff;
  margin-left: -50%;
  margin-right: 50%;
}

.chart .chart-vert {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.chart .chart-horz {
  height: 100%;
  display: flex;
  flex-direction: row;
  flex-grow: 1;
}

.chart .chart-area {
  flex-grow: 1;
  position: relative;
}

.chart .chart-axis-placement {
  height: 1em;
}

.chart .chart-axis-placement.bottom {
  min-height: 1px;
  margin-top: 3px;
}

.chart .chart-axis.bottom {
  min-height: 1px;
  margin-top: 2px;
  border-top: 1px solid #e2e5e6;
  height: 1em;
  font-size: 80%;
}

.chart .chart-axis.bottom > * {
  display: inline-block;
  text-align: center;
  white-space: nowrap;
}

.chart .chart-axis.left {
  flex-grow: 1;
  min-width: 1px;
  margin-right: 2px;
  border-right: 1px solid #e2e5e6;
  position: relative;
}

.chart .chart-axis.left > * {
  position: absolute;
  line-height: 1;
  text-align: right;
  right: 0px;
  left: 0px;
  padding-right: 2px;
  border-bottom: 1px solid #e2e5e6;
}

.chart .chart-axis.right {
  flex-grow: 1;
  min-width: 1px;
  margin-left: 2px;
  border-left: 1px solid #e2e5e6;
  position: relative;
}

.chart .chart-axis.right > * {
  position: absolute;
  line-height: 1;
  text-align: left;
  left: 0px;
  padding-left: 2px;
  border-bottom: 1px solid #e2e5e6;
}

.zone-select {
  position: relative;
}

.zone-select .zone-item {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.zone-select .selected-zone {
  padding: 2px;
}

.zone-select .zone-list {
  display: none;
  z-index: 1000;
  position: absolute;
  top: 0px;
  background-color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #b4b4b4;
  padding: 1px;
}

.zone-select:hover .zone-list {
  display: block;
}

.tool-item-select {
  display: inline-block;
  vertical-align: top;
  color: #012C3D;
  font-size: 85%;
  background-color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding-left: 4px;
  padding-right: 4px;
  position: relative;
}

.tool-item-select .tool-item-option {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 4px 2px;
}

.tool-item-select .selected-option {
  padding: 2px;
}

.tool-item-select .tool-item-select-list {
  display: none;
  z-index: 1000;
  position: absolute;
  top: 0px;
  right: 0px;
  background-color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #b4b4b4;
  padding: 1px;
}

.tool-item-select .tool-item-select-list .tool-item-option.active {
  background-color: #455D79;
  color: #fff;
}

.tool-item-select .tool-item-select-list .tool-item-option:hover {
  color: #F9B233;
}

.tool-item-select:hover .tool-item-select-list {
  display: block;
}

.hinted {
  position: relative;
}

.hinted .hint {
  display: none;
  position: absolute;
  width: auto;
  z-index: 1000;
  top: 100%;
  left: -100px;
  right: -100px;
  text-align: center;
}

.hinted .hint > div {
  display: inline-block;
  background-color: #4d4256;
  border-radius: 6px;
  padding: 1px 4px;
  color: #fff;
}

.hinted:hover .hint:not(:hover) {
  display: block;
}

.sort-button {
  display: inline;
  cursor: pointer;
  padding-left: 6px;
  opacity: 0;
  color: #dae5ff;
}

.sort-button:hover {
  color: #3480ac;
}

.sort-button.active {
  opacity: 1;
  color: #dc4f77;
}

*:hover > .sort-button {
  opacity: 1;
}

.locale-span {
  display: inline-block;
  position: relative;
}

.locale-span > .setup {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: none;
  position: absolute;
  left: 100%;
  padding-left: 3px;
  top: 0px;
}

.locale-span.configurable:hover > .setup {
  display: block;
}

.locale-span.configurable:hover > .setup:hover {
  color: #dc4f77;
}

.locale-span.configurable:hover > .setup:active {
  color: #3480ac;
}

.table-widget th:hover {
  background-color: #fff0de;
}

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

.table-widget td:not(:last-child) {
  padding-right: 4px;
}

.table-widget td:not(:first-child) {
  text-align: right;
}

.table-widget .table-widget-header {
  height: 8px;
  margin: 1px;
  font-size: 75%;
}

.table-widget .table-widget-header:active {
  background-color: #c4c8c9;
}

.table-widget.small .table-widget-header {
  height: 7px;
  margin: -2px 0px 2px 0px;
  font-size: 65%;
}

.table-widget.full table {
  width: 100%;
}

.table-widget.full .table-widget-header {
  height: 14px;
  font-size: 100%;
}

.table-widget tr.selectable:hover td {
  background-color: #ddd;
}

.color-picker {
  position: relative;
  display: inline-block;
  vertical-align: bottom;
  min-width: 32px;
  height: 16px;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.color-picker:hover {
  border: 1px solid #dae5ff;
}

.color-picker:active {
  border: 1px solid #3480ac;
}

.color-picker .color-value {
  cursor: pointer;
  margin: 1px;
  width: 30px;
  height: 14px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.color-picker .color-value.font {
  text-align: center;
  font-size: 10px;
  font-weight: bold;
}

.color-picker .color-value.font.empty {
  color: #fff;
}

.color-picker .color-value.empty,
.color-picker .color-value.named {
  background-image: linear-gradient(45deg, #fff 25%, #e2e5e6 25%, #e2e5e6 50%, #fff 50%, #fff 75%, #e2e5e6 75%, #e2e5e6 100%);
  background-size: 3.5px 3.5px;
}

.color-picker .color-value.named {
  width: auto;
  min-width: 28px;
  max-width: 42px;
  overflow: hidden;
  white-space: nowrap;
  line-height: 1;
  font-size: 10px;
  height: 12px;
  padding: 1px;
}

.color-picker .color-picker-dialog {
  position: absolute;
  top: -1px;
  left: -1px;
  background-color: #fff;
  z-index: 1000;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.color-picker .color-picker-area {
  position: relative;
  width: 20px;
  height: 120px;
  border: 1px solid #aaa;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.color-picker .color-picker-area > #mark {
  position: absolute;
  width: 22px;
  height: 8px;
  margin-left: -2px;
  margin-right: -2px;
  margin-top: -4px;
  border: 1px solid #aaa;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.color-picker .color-picker-hue {
  position: relative;
  width: 20px;
  height: 120px;
  border: 1px solid #aaa;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background: linear-gradient(to right, #f00, #ff0 16.6%, #0f0 33.3%, #0ff 50%, #00f 66.6%, #f0f 83.3%, #f00 100%), linear-gradient(to bottom, rgba(128, 128, 128, 0) 0%, #808080 100%);
}

.color-picker .color-picker-hue > #mark {
  position: absolute;
  width: 22px;
  height: 8px;
  margin-left: -2px;
  margin-right: -2px;
  margin-top: -4px;
  border: 1px solid #aaa;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.color-picker .color-picker-cone {
  position: relative;
  cursor: pointer;
  width: 120px;
  height: 120px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background: radial-gradient(closest-side, #fff, transparent), left top / cover url("/v/img/colorcone.png");
  background: radial-gradient(closest-side, #fff, transparent), conic-gradient(#f00, #ff0 16.6%, #0f0 33.3%, #0ff 50%, #00f 66.6%, #f0f 83.3%, #f00 100%);
}

.color-picker .color-picker-cone > #mark {
  position: absolute;
  width: 12px;
  height: 12px;
  margin-left: -6px;
  margin-right: -6px;
  margin-top: -6px;
  margin-bottom: -6px;
  border: 1px solid #aaa;
  background-color: transparent;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
}

.insert-block {
  cursor: pointer;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #fff;
  border: 1px dashed #012C3D;
  padding: 4px;
  text-align: center;
  font-weight: bold;
}

.insert-block:hover {
  color: #455D79;
  border: 1px dashed #455D79;
}

.insert-block:active {
  color: #00080b;
  border: 1px dashed #00080b;
}

.graph {
  width: 100%;
  height: 100%;
}

.graph > table {
  width: 100%;
  height: 100%;
}

.graph .graph-data > svg {
  width: 100%;
  height: 100%;
}

.graph .axis {
  position: relative;
}

.graph .axis.left {
  border-right: 1px solid #ddd;
  white-space: nowrap;
}

.graph .axis.right {
  border-left: 1px solid #ddd;
  white-space: nowrap;
}

.graph .axis.bottom {
  border-top: 1px solid #ddd;
  height: 18px;
  white-space: nowrap;
}

.graph .axis.top {
  border-bottom: 1px solid #ddd;
  height: 18px;
  white-space: nowrap;
}

.graph .axis > .axis-mark {
  position: absolute;
}

.graph .axis.left > .axis-mark {
  right: 0px;
  padding-bottom: 1px;
  padding-right: 2px;
}

.graph .axis.left > .axis-mark::after {
  content: '';
  position: absolute;
  right: 0px;
  bottom: 0px;
  width: 4px;
  border-bottom: 1px solid #ddd;
}

.graph .axis.right > .axis-mark {
  left: 0px;
  padding-bottom: 1px;
  padding-left: 2px;
}

.graph .axis.right > .axis-mark::after {
  content: '';
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 4px;
  border-bottom: 1px solid #ddd;
}

.graph .axis.top > .axis-mark {
  bottom: 0px;
  padding-top: 1px;
  padding-left: 2px;
}

.graph .axis.top > .axis-mark::after {
  content: '';
  position: absolute;
  left: 0px;
  bottom: 0px;
  height: 4px;
  border-left: 1px solid #ddd;
}

.graph .axis.bottom > .axis-mark {
  top: 0px;
  padding-bottom: 1px;
  padding-left: 2px;
}

.graph .axis.bottom > .axis-mark::after {
  content: '';
  position: absolute;
  left: 0px;
  top: 0px;
  height: 4px;
  border-left: 1px solid #ddd;
}

.popup-menu {
  color: #012C3D;
  margin: 1px 3px;
  display: inline-block;
  position: relative;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.popup-menu .popup-menu-button {
  display: inline-block;
  cursor: pointer;
  padding: 1px 8px 2px 8px;
  border-radius: 22px;
  margin-left: 8px;
  border: 1px solid #012C3D;
}

.popup-menu .title {
  font-size: 80%;
}

.popup-menu .popup-menu-popup {
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  position: absolute;
  right: 0px;
  top: 100%;
  z-index: 1000;
  padding: 8px;
  background-color: #fff;
  color: #2a2a2a;
}

.arrange-list {
  position: relative;
}

.arrange-list:not(.arranging) .arrange-item:hover {
  background-color: #f2de9c;
}

.arrange-list .arrange-item {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  background-color: #f2f2f2;
  margin-bottom: 2px;
}

.arrange-list .arrange-item.active {
  background-color: #aebff2;
}

.equipment-state-widget {
  text-align: left;
}

.equipment-state-widget .equipment {
  display: inline-block;
  background-color: #d1d4d5;
  color: #012C3D;
  margin-right: 1px;
  margin-left: 1px;
  border-radius: 2px;
  min-width: 24px;
  margin-bottom: 2px;
  text-align: center;
}

.nav > li.current {
  background-color: #dc4f77;
}

.navbar-topics {
  color: #fff;
}

.navbar-item {
  display: inline-block;
}

.topic-button {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
  display: inline-block;
  color: #fff;
  padding-top: 16px;
  padding-left: 16px;
  padding-right: 16px;
  padding-bottom: 18px;
}

.topic-button.active {
  color: #F9B233;
}

.topic-button.active::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0px;
  height: 12px;
  width: 8px;
  margin-left: -4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  background-color: #F9B233;
}

.navbar-search,
.navbar-user {
  background-color: #f5f5f5;
  padding: 9px;
}

.nav > li.open > a {
  background-color: #fff !important;
}

.nav > li > a {
  color: #012C3D !important;
}

.nav > li > a:hover {
  color: #012C3D !important;
}

.topic-menu {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #012C3D;
  color: #fff;
}

.topic-menu:hover {
  background-color: #455D79;
}

.topic-menu:active {
  background-color: #012C3D;
}

.topic {
  display: inline-block;
  font-size: 18px;
  font-family: "IBM Plex Sans Thin", sans-serif;
  margin-right: 16px;
  padding-top: 12px;
  padding-bottom: 12px;
  margin-left: 12px;
}

.logo {
  cursor: pointer;
  padding: 8px;
  line-height: 0;
}

.logo > img {
  height: 32px;
}

.topics {
  flex-grow: 1;
  margin-left: 38px;
  line-height: 1;
}

.pinned {
  display: inline-block;
}

.header-mark {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
  color: #fff;
  height: 44px;
  background-color: #455D79;
  font-size: 22px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: top;
  margin: 2px 6px 2px 24px;
  padding-top: 12px;
}

.view-button {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
  display: inline-block;
  color: #fff;
  padding-top: 18px;
  padding-left: 12px;
  padding-right: 12px;
  padding-bottom: 16px;
  font-size: 14px;
}

.view-button:hover {
  background-color: #455D79;
}

.view-button.active {
  color: #F9B233;
}

.view-button.active::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0px;
  height: 10px;
  width: 8px;
  margin-left: -4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  background-color: #F9B233;
}

.menu {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  position: absolute;
  top: 48px;
  left: 0;
  bottom: 0;
  background-color: rgba(245, 245, 245, 0.93);
}

.menu .topic-list {
  flex-grow: 1;
  display: inline-block;
  flex-wrap: wrap;
  padding: 16px !important;
  padding: 15px !important;
}

.menu .topic-list .topic-plate {
  background-color: #fff;
  color: #012C3D;
  margin-bottom: 16px !important;
  margin-bottom: 15px !important;
  padding-top: 4px !important;
  padding-top: 5px !important;
  padding-bottom: 4px !important;
  padding-bottom: 5px !important;
  padding-left: 8px !important;
  padding-right: 8px !important;
  position: relative;
  box-sizing: border-box;
}

.menu .topic-list .topic-plate .topic-caption {
  font-size: 18px;
}

.menu .topic-list .topic-plate .topic-view {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
  display: inline-block;
  color: #012C3D;
  padding: 8px;
}

.menu .topic-list .topic-plate .topic-view:hover {
  background-color: #f5f5f5;
}

.menu .topic-list .topic-plate .topic-view:active {
  background-color: #fad0a5;
}

.menu .topic-list .topic-plate .topic-view.active {
  color: #455D79;
  font-weight: bold;
}

.menu .topic-list .topic-plate .topic-view:not(:last-child) {
  margin-right: 9px;
}

.menu .topic-list .topic-plate .topic-view:not(:last-child)::after {
  position: absolute;
  display: block;
  content: ' ';
  width: 3px;
  top: 13px;
  margin-left: 3px;
  left: 100%;
  height: 7px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  background-color: #acacac;
  opacity: 0.3;
}

.menu .topic-list .topic-plate.active {
  background-color: #FFF0D4;
}

.menu .topic-list .topic-plate.active .topic-caption {
  color: #455D79;
  font-weight: bold;
}

.action-bar {
  position: relative;
  background-color: #fff;
  color: #012C3D;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  padding-left: 32px;
  padding-right: 32px;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
}

.action-bar::before {
  content: '';
  position: absolute;
  left: 15px;
  top: 18px;
  bottom: 18px;
  width: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #FF4D26;
}

.action-bar::after {
  content: '';
  position: absolute;
  right: 15px;
  top: 18px;
  bottom: 18px;
  width: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #FF4D26;
}

.panel-flat {
  margin: 0 !important;
  border: 0;
}

.split-panel {
  display: inline-block;
  vertical-align: top;
}

@media (max-width: 960px) {
  .split-panel {
    width: 50%;
  }

  .split-panel:nth-child(even) {
    padding-left: 3px;
  }

  .split-panel:nth-child(odd) {
    padding-right: 3px;
  }
}

@media (max-width: 480px) {
  .split-panel {
    width: 100%;
  }
}

@media (min-width: 961px) {
  .split-panel {
    width: 25%;
  }

  .split-panel:nth-child(4n+1) {
    padding-right: 4px;
  }

  .split-panel:nth-child(4n+2) {
    padding-right: 2px;
    padding-left: 2px;
  }

  .split-panel:nth-child(4n+3) {
    padding-right: 2px;
    padding-left: 2px;
  }

  .split-panel:nth-child(4n) {
    padding-left: 4px;
  }
}

.split-panel-lg {
  vertical-align: top;
}

@media (max-width: 960px) {
  .split-panel-lg {
    width: 73%;
    margin-left: 6px;
  }
}

@media (max-width: 480px) {
  .split-panel-lg {
    width: 100%;
  }
}

@media (min-width: 961px) {
  .split-panel-lg {
    width: 48%;
    margin-left: 6px;
  }
}

.area {
  display: inline-block;
  vertical-align: top;
  border-radius: 4px;
  background-color: #fff;
  margin-right: 16px;
}

.area .caption {
  font-weight: bold;
  font-size: 105%;
}

.area > :not(.header) {
  margin: 16px;
}

.area .header {
  font-size: 18px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  padding: 6px 16px;
  color: #012C3D;
  font-weight: bold;
  border-bottom: 1px solid #d1d4d5;
}

.area-3 {
  display: inline-block;
  vertical-align: top;
  border-radius: 4px;
  background-color: #fff;
  margin-right: 16px;
  width: 60%;
  margin-bottom: 10px;
}

.area-3 .caption {
  font-weight: bold;
  font-size: 105%;
}

.area-3 > :not(.header) {
  margin: 16px;
}

.area-3 .header {
  font-size: 18px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  padding: 6px 16px;
  color: #012C3D;
  font-weight: bold;
  border-bottom: 1px solid #d1d4d5;
}

@media (max-width: 1280px) {
  .area-3 {
    width: 75%;
  }
}

@media (max-width: 960px) {
  .area-3 {
    width: 100%;
  }
}

.area-2 {
  display: inline-block;
  vertical-align: top;
  border-radius: 4px;
  background-color: #fff;
  margin-right: 16px;
  width: 40%;
  margin-bottom: 10px;
}

.area-2 .caption {
  font-weight: bold;
  font-size: 105%;
}

.area-2 > :not(.header) {
  margin: 16px;
}

.area-2 .header {
  font-size: 18px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  padding: 6px 16px;
  color: #012C3D;
  font-weight: bold;
  border-bottom: 1px solid #d1d4d5;
}

@media (max-width: 1280px) {
  .area-2 {
    width: 75%;
  }
}

@media (max-width: 960px) {
  .area-2 {
    width: 100%;
  }
}

.area-1 {
  display: inline-block;
  vertical-align: top;
  border-radius: 4px;
  background-color: #fff;
  margin-right: 16px;
  width: 20%;
  margin-bottom: 10px;
}

.area-1 .caption {
  font-weight: bold;
  font-size: 105%;
}

.area-1 > :not(.header) {
  margin: 16px;
}

.area-1 .header {
  font-size: 18px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  padding: 6px 16px;
  color: #012C3D;
  font-weight: bold;
  border-bottom: 1px solid #d1d4d5;
}

@media (max-width: 1280px) {
  .area-1 {
    width: 60%;
  }
}

@media (max-width: 960px) {
  .area-1 {
    width: 100%;
  }
}

.hover-spot {
  position: relative;
}

.hover-spot .drop-panel {
  display: none;
  position: absolute;
  z-index: 1000;
  -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.05);
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.05);
  background-color: #fff;
  border-radius: 4px;
}

.hover-spot:hover:not(.disabled) .drop-panel {
  display: block;
}

.parameter {
  position: relative;
  display: inline-block;
}

.parameter > * {
  overflow: hidden;
  background-color: #fff;
  border-radius: 4px;
  cursor: pointer;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.parameter .full {
  display: none;
  position: absolute;
  z-index: 1000;
  -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.05);
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.05);
}

.parameter .icon {
  padding-top: 4px !important;
  padding-top: 5px !important;
  padding-bottom: 4px !important;
  padding-bottom: 5px !important;
  padding-left: 16px !important;
  padding-left: 15px !important;
  padding-right: 16px !important;
  padding-right: 15px !important;
  text-align: center;
}

.parameter .caption {
  padding-left: 16px !important;
  padding-left: 15px !important;
  padding-right: 16px !important;
  padding-right: 15px !important;
}

.parameter:hover:not(.disabled) .full {
  display: block;
}

.parameter-selection {
  padding: 4px !important;
  padding: 5px !important;
}

.parameter-selection:hover {
  background-color: #5d9cec;
  color: #fff !important;
}

.parameter-selector {
  margin-left: 8px !important;
  margin-top: 4px !important;
  margin-top: 5px !important;
  margin-bottom: 4px !important;
  margin-bottom: 5px !important;
  display: inline-block;
}

.parameter-selector .panel {
  overflow: hidden;
  border: 0px !important;
}

.parameter-panel {
  display: none;
  position: absolute;
  z-index: 1000;
}

.parameter-selector:hover .parameter-panel {
  display: block;
}

.calendar-strip {
  position: relative;
  background-color: #fff;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  font-size: 90%;
  width: 14em;
  overflow-y: hidden;
}

.calendar-strip .month-header {
  height: 1.5em;
  font-weight: bold;
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
  margin-bottom: 0.1em;
}

.calendar-strip .week {
  height: 1.5em;
}

.calendar-strip .month {
  position: absolute;
  left: 0px;
  right: 0px;
  text-align: center;
}

.calendar-strip .day {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
}

.timetable-selection {
  position: absolute;
  top: 0px;
  bottom: 0px;
  background-color: #999;
  opacity: 0.2;
  min-width: 2px;
  margin-top: -1px;
}

.timetable-record.selection {
  background-color: #e0eeff;
}

.timetable-item {
  font-size: 12px;
  line-height: 1;
  overflow: hidden;
  white-space: nowrap;
  height: 14px;
  padding: 2px;
  pointer-events: auto;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.timetable-drag-item {
  position: absolute;
  opacity: 0.8;
  background-color: #ededed;
  padding: 4px;
  border: 1px solid #b5b5b5;
}

.timetable-drop-zone {
  position: absolute;
  opacity: 0.6;
  background-color: #eec208;
  top: 0px;
  bottom: 0px;
}

.timetable-item-details {
  margin: -1px -1px;
}

.timetable-item-details .timetable-item-detail {
  display: inline-block;
}

.timetable-item.active {
  border: 2px solid #1c65cb;
  padding: 0px 0px;
}

.timetable-item.black {
  background-color: #000;
  color: #fff;
}

.timetable-item.gray {
  background-color: #999;
  color: #fff;
}

.timetable-item.transparent {
  background-color: transparent;
  color: #000;
}

.timetable-record-item {
  height: 14px;
  pointer-events: none;
}

.timetable-record-item.large {
  height: 24px;
}

.timetable-record-item.large .timetable-item {
  font-size: 20px;
  height: 24px;
}

.timetable-custom-item {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%;
  border-left: 1px solid #e0e0e0;
  border-right: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  background-color: #f0f0f0;
  padding: 4px;
}

.timetable-custom-item .name {
  display: inline-block;
  cursor: pointer;
  padding: 2px 4px;
  margin-right: 2px;
  vertical-align: top;
  font-weight: bold;
  font-size: 90%;
}

.timetable-custom-item:first-child {
  border-top: 1px solid #e0e0e0;
}

.timetable-custom-item .dragging {
  opacity: 0.1;
}

.timetable-custom-item.dragging {
  background-color: #f2f2f2;
  opacity: 0.7;
}

.timetable-custom-detail {
  display: inline-block;
  cursor: pointer;
  vertical-align: top;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 0px 4px;
  margin-right: 2px;
}

.timetable-custom-detail.timetable-custom-hidden-detail {
  opacity: 0.6;
}

.timeline-header {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
}

.timeline-header > * {
  overflow: hidden;
}

.timeline-record {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
}

.timeline-item {
  position: absolute;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #00b3ee;
  min-width: 6px;
  white-space: nowrap;
}

.tabulation > tr > td {
  padding: 3px;
}

.tabulation > tr > td:not(:first-child) {
  border-left: 2px solid #ddd;
}

.tabulation > tr:not(:first-child) > td {
  border-top: 2px solid #ddd;
}

.tabulation > tr:not(:first-child) > td:not(:first-child) {
  vertical-align: middle;
  text-align: center;
  font-size: 115%;
}

.tabulation .row-header {
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  min-height: 40px;
  padding: 4px;
  text-align: center;
  border-radius: 6px;
  border: 1px solid #eee;
  background-color: #fff;
  line-height: 24px;
}

.tabulation .column-header {
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  min-height: 40px;
  padding: 4px;
  text-align: center;
  border-radius: 6px;
  border: 1px solid #eee;
  background-color: #fff;
  line-height: 24px;
}

.tabulation .add-button {
  cursor: pointer;
  width: 60px;
}

.tabulation .add-button:before {
  content: "+";
  font-size: 200%;
  line-height: 1;
}

.tabulation .add-button:hover {
  background-color: #96c8e6;
}

.tabulation .add-button:active {
  background-color: #7ca9c4;
}

.data-table {
  width: 100%;
}

.data-table .drag-item {
  font-weight: bold;
  border-bottom: 2px solid #ddd;
  padding: 4px 6px 2px 12px;
  vertical-align: bottom;
  cursor: pointer;
  background-color: #54c8ff;
}

.data-table th {
  font-weight: bold;
  border-bottom: 2px solid #ddd;
  padding: 4px 6px 2px 12px;
  vertical-align: bottom;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.data-table th.dragging {
  opacity: 0.1;
}

.data-table th:hover {
  background-color: #fff0de;
}

.data-table th:active {
  background-color: #54c8ff;
}

.data-table td {
  padding: 2px 8px;
}

.data-table tr:not(:last-child) td {
  border-bottom: 1px solid #ddd;
}

.production-list-item {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  background: #f6f6ff;
  font-size: 12px;
  color: #000;
  border-radius: 4px;
  padding: 3px 4px;
  line-height: 1;
  overflow: hidden;
  white-space: nowrap;
  outline-style: none;
}

.production-list-item.active {
  border: 2px solid #fad732;
  padding: 1px 2px;
}

.production-machine-queue {
  vertical-align: top;
  background-color: #fff;
  border-top: 1px solid #eee;
  border-right: 1px solid #eee;
}

@media (max-width: 1060px) {
  .production-machine-queue {
    width: 24%;
  }
}

@media (max-width: 840px) {
  .production-machine-queue {
    width: 32%;
  }
}

@media (max-width: 680px) {
  .production-machine-queue {
    width: 48%;
  }
}

@media (max-width: 420px) {
  .production-machine-queue {
    width: 96%;
  }
}

@media (min-width: 1061px) {
  .production-machine-queue {
    width: 19.5%;
  }
}

.production-machine-queue.active {
  background-color: #ffffc4;
}

.production-act-info td {
  vertical-align: top;
}

.production-queue-panel td {
  height: 28px;
  vertical-align: bottom;
}

.production-task-panel td {
  height: 28px;
  vertical-align: bottom;
}

.production-tasks-queue td {
  padding-bottom: 1px;
  vertical-align: top;
}

.production-tasks-queue td:not(:first-child) {
  padding-left: 4px;
}

.production-act-item {
  white-space: normal;
  font-size: 80%;
  margin: 2px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.production-act-item span {
  display: inline-block;
  white-space: normal;
}

.production-past {
  background-color: #a0d5a0;
  opacity: 0.4;
}

.production-unscheduled {
  background: #edd;
  opacity: 0.4;
}

.production-site-row.active {
  background-color: #ffffc4;
}

.production-timeline-item {
  font-size: 12px;
  line-height: 1;
  overflow: hidden;
  white-space: nowrap;
  height: 14px;
  padding: 2px;
}

.production-timeline-details {
  margin: -1px -1px;
}

.production-timeline-item.active {
  border: 2px solid #1c65cb;
  padding: 0px 0px;
}

.production-task.started {
  background-color: #d8f8ff;
}

.production-task.active {
  background-color: #ffffc4;
}

.production-machine-queue.active .production-task.active {
  background-color: #e8e8bd;
}

.production-task-list {
  font-size: 90%;
}

.production-task-list.active {
  background-color: #ffffc4;
}

.production-task-list td {
  height: auto;
}

.hierarchy-line {
  display: inline-block;
  width: 6px;
  height: 100%;
  margin-left: 6px;
  border-left: 1px solid #ddd;
}

.production-priority-button {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
  width: 1em;
  text-align: center;
  border: 1px solid;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-size: 80%;
  padding: 1px;
  font-weight: bold;
}

.production-priority-button:hover {
  opacity: 0.5;
}

.production-priority-button:active {
  opacity: 0.7;
}

.production-priority-select-button {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
  width: 1em;
  text-align: center;
  border: 1px solid;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-size: 80%;
  padding: 1px;
  font-weight: bold;
}

.shift-table .month-day {
  font-size: 10px;
  display: inline-block;
  background-color: #455D79;
  font-size: 80%;
  font-weight: bold;
  padding: 1px 6px;
  margin: 0px 4px;
  color: #fff;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  background-color: #f5f5f5;
  color: #012C3D;
  width: 1.3em;
  text-align: center;
}

.shift-table .month-day .tag-button {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline;
  margin-left: 3px;
  margin-right: -3px;
  padding-left: 2px;
}

.shift-table .month-day .tag-button:hover {
  color: #ddd;
}

.shift-table .month-day.green {
  border: 1px solid #5a784b;
  color: #5a784b;
}

.shift-table .month-day.green .tag-button:hover {
  color: #445b39;
}

.shift-table .month-day.blue {
  border: 1px solid #716fd3;
  color: #716fd3;
}

.shift-table .month-day.blue .tag-button:hover {
  color: #5856a4;
}

.shift-table tr:hover .slot-name {
  color: #F9B233;
}

.shift-table .slot {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-align: center;
  height: 100%;
}

.shift-table .slot:hover {
  color: #F9B233;
}

.shift-table .slot.empty {
  background-color: #f5f5f5;
}

.shift-table .slot.inherited {
  font-style: italic;
  color: #455D79;
}

.shift-table .text-disabled .inherited {
  color: #d1d4d5;
}

.shift-actions {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  position: absolute;
  right: 0px;
  top: 4px;
  background-color: #d7f1ff;
  z-index: 20;
}

.image-container {
  display: inline-block;
  min-width: 80px;
  min-height: 80px;
  text-align: center;
  margin-top: 8px;
}

.script {
  position: relative;
  padding: 16px;
  overflow-y: auto;
}

.script .image-container {
  background-color: #d9eeff;
}

.script.dragging {
  cursor: grabbing;
}

.script .script-item {
  position: relative;
  margin-bottom: 12px;
}

.script .script-item .insert-space {
  height: 14px;
  margin-top: -6px;
  margin-bottom: -12px;
}

.script .script-item .insert-space > * {
  position: relative;
  display: none;
  background-color: #f5f5f5;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #455D79;
  color: #455D79;
  padding: 0 16px;
  cursor: pointer;
  z-index: 1000;
}

.script .script-item .details {
  display: inline-block;
  position: relative;
  background-color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #e2e5e6;
  padding: 4px 4em 4px 4em;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  outline-style: none;
  -webkit-box-shadow: -1px 1px 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: -1px 1px 1px 1px rgba(0, 0, 0, 0.05);
}

.script .script-item .details:focus-within {
  background-color: #d7f1ff;
}

.script .script-item .details .number {
  display: inline-block;
  font-size: 14px;
  font-weight: bold;
  min-width: 2em;
  padding-right: 6px;
}

.script .script-item .details .description {
  font-size: 16px;
  padding-right: 4em;
}

.script .script-item .details .thumb {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 8px;
  background-color: #012C3D;
  border-top-left-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
}

.script .script-item .details .thumb.active {
  cursor: grab;
}

.script .script-item .details .conduct {
  font-size: 16px;
  height: 16px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px;
  padding: 0px 0px 4px 0px;
  margin: 0px 4px 0px 0px;
}

.script .script-item .details .conduct > .radio-item {
  margin-top: -2px;
}

.script .script-item .details .conduct > .line {
  position: relative;
  display: inline-block;
  width: 14px;
  height: 16px;
  margin-left: -4px;
  margin-right: -4px;
}

.script .script-item .details .conduct > .line::after {
  content: '';
  position: absolute;
  top: 8px;
  height: 4px;
  width: 14px;
  background-color: #8595a1;
}

.script .script-item .details .conduct > .line.active::after {
  background-color: #F9B233;
}

.script .script-item .details .pull-action {
  position: absolute;
  top: 5px;
  left: 1.5em;
}

.script .script-item .details .push-action {
  position: absolute;
  top: 5px;
  left: 2.5em;
}

.script .script-item .children {
  margin-left: 4px;
  padding-top: 12px;
  padding-left: 8px;
  border-left: 1px solid #012C3D;
}

.script .script-item .children > .insert-space {
  margin-top: -10px;
  margin-bottom: -4px;
}

.script .script-item .description-edit {
  width: 340px;
  margin-right: 2em;
}

.script .script-item .action-bar {
  display: none;
  position: absolute;
  top: 100%;
  margin-top: -6px;
  left: 72px;
  z-index: 1000;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  border: 1px solid #012C3D;
  background-color: #fff;
  padding: 2px 4px;
}

.script .script-item .action-bar .action-button {
  display: inline-block;
  margin: 2px 4px;
}

.script .script-item.dragged > .details {
  opacity: 0.2;
}

.script.editable .script-item:not(.editing) .insert-space:hover > * {
  display: block;
}

.script.editable .script-item:not(.editing) .details:hover .action-bar {
  display: block;
}

.script.editable > .insert-space {
  position: relative;
  background-color: #f5f5f5;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #455D79;
  color: #455D79;
  padding: 0 16px;
  cursor: pointer;
  z-index: 1000;
  height: 14px;
  margin-top: -6px;
  margin-bottom: -12px;
}

.work-basic .work-item {
  margin-bottom: 4px;
}

.work-basic .work-item > .work-item-header {
  padding: 2px;
  border-left: 3px solid #455D79;
}

.work-basic .work-item > .work-item-header > .work-item-value {
  position: absolute;
  left: 30%;
  width: 30%;
  margin-left: 12px;
  color: #c69eaa;
}

.work-basic .work-item > .work-item-header > .work-item-time {
  position: absolute;
  left: 60%;
  width: 30%;
  margin-left: 22px;
  color: #c69eaa;
}

.work-basic .work-item > .work-item-header > .work-item-time > .work-item-start {
  position: absolute;
  left: 0;
}

.work-basic .work-item > .work-item-header > .work-item-time > .work-item-time-sep {
  text-align: center;
  position: absolute;
  width: 100%;
}

.work-basic .work-item > .work-item-header > .work-item-time > .work-item-completion {
  position: absolute;
  right: 0;
}

.work-basic .work-item > .children {
  margin-left: 1px;
  border-left: 1px solid #455D79;
  padding-left: 3px;
}

.work-basic .work-item > .children > *:first-child {
  padding-top: 4px;
}

.task-works .work-item:not(.in-task) > .work-item-header {
  border-left: 3px solid #d4dadc;
  color: #d4dadc;
}

.task-works .work-item:not(.in-task) > .work-item-header > .work-item-value {
  color: #d4dadc;
}

.task-works .work-item:not(.in-task) > .work-item-header > work-item-time {
  color: #d4dadc;
}

.task-works .work-item:not(.in-task) > .children {
  border-left: 1px solid #d4dadc;
}

.work {
  position: relative;
  padding: 16px;
  overflow-y: auto;
}

.work .work-item {
  position: relative;
  margin-bottom: 12px;
}

.work .work-item .details {
  position: relative;
  display: inline-block;
  padding: 4px 1em 4px 2em;
  background-color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #e2e5e6;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-shadow: -1px 1px 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: -1px 1px 1px 1px rgba(0, 0, 0, 0.05);
}

.work .work-item .details .number {
  display: inline-block;
  font-size: 14px;
  font-weight: bold;
  min-width: 2em;
  padding-right: 6px;
}

.work .work-item .details .description {
  font-size: 16px;
  vertical-align: bottom;
}

.work .work-item .details .result {
  font-size: 18px;
  vertical-align: middle;
  padding-left: 16px;
}

.work .work-item .details .thumb {
  position: absolute;
  left: -1px;
  top: 0;
  bottom: -1px;
  width: 8px;
  border-top-left-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
}

.work .work-item > .children {
  margin-left: 4px;
  padding-top: 8px;
  padding-left: 8px;
  border-left: 1px solid #d1d4d5;
}

.work .work-item.waiting > .details > .thumb {
  background-color: #012C3D;
}

.work .work-item.started > .details > .thumb {
  background-color: #b3cdf7;
}

.work .work-item.started > .children {
  border-left: 1px solid #b3cdf7;
}

.work .work-item.completed > .details > .thumb {
  background-color: #8595a1;
}

.work .work-item.completed > .children {
  border-left: 1px solid #8595a1;
}

.work .work-item.succeeded > .details > .thumb {
  background-color: #a6d2b1;
}

.work .work-item.succeeded > .children {
  border-left: 1px solid #a6d2b1;
}

.work .work-item.failed > .details > .thumb {
  background-color: #f7b3b3;
}

.work .work-item.failed > .children {
  border-left: 1px solid #f7b3b3;
}

.hidden-file-input {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  white-space: nowrap;
  width: 1px;
}

.image-target {
  display: inline-block;
  padding: 20px;
  border: 1px solid #8595a1;
  color: #8595a1;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.image-target:hover:not(.readonly) {
  color: #6a7c89;
  border: 1px solid #6a7c89;
}

.image-target:active:not(.readonly) {
  color: #F9B233;
  border: 1px solid #F9B233;
}

.work-item-choice {
  font-size: 80%;
  border-radius: 4px;
  padding: 2px 8px;
}

.config-item {
  padding-left: 25px;
  margin-top: 4px;
}

.config-item.dragging {
  background-color: #455D79;
  color: #F9B233;
}

.config-item .config-item-header {
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  display: flex;
  flex-direction: row;
}

.config-item .config-item-header > span:first-child {
  flex-grow: 1;
}

.config-item .config-item-header.active {
  color: #F9B233;
}

.config-item .config-item-header .switch {
  margin-top: 7px;
}

.config-item .config-item-header.config-sub-item {
  padding-left: 6px;
}

.dataset-parameter {
  color: #012C3D;
  margin: 1px 6px -5px 6px;
  padding-bottom: 6px;
  display: inline-block;
  position: relative;
  white-space: nowrap;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.dataset-parameter .icon {
  display: inline-block;
  font-size: 80%;
  margin-right: 4px;
  position: relative;
}

.dataset-parameter .icon.active {
  color: #F9B233;
}

.dataset-parameter .icon .icon-main {
  position: relative;
  background-color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.dataset-parameter .icon .icon-add {
  position: absolute;
  font-size: 140%;
  top: 40%;
  left: -20%;
}

.dataset-parameter small {
  font-size: 80%;
}

.dataset-parameter .parameter-popup {
  display: none;
  position: absolute;
  z-index: 1000;
  left: -5px;
  top: 100%;
  min-width: 100%;
  flex-direction: column;
  color: #012C3D;
  background-color: #fff;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  max-height: 252px;
}

.dataset-parameter .parameter-popup .param-desc {
  color: #abaeaf;
}

.dataset-parameter .parameter-popup > .param-header {
  padding: 4px;
}

.dataset-parameter .parameter-popup > .param-header td {
  border-bottom: 1px solid #e2e5e6;
}

.dataset-parameter .parameter-popup > .list {
  flex-grow: 1;
  overflow-y: auto;
}

.dataset-parameter .parameter-popup > .list > * {
  display: block;
}

.dataset-parameter:hover .parameter-popup {
  display: flex;
}

.dataset-member {
  display: inline-block;
}

.dataset-member > .separator {
  display: inline;
}

.dataset-member:not(:last-child) > .separator:empty:after {
  content: '\00B7';
  margin: 0px 2px;
  color: #8595a1;
}

.dataset-value {
  display: inline-block;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.dataset-value > .value-option {
  display: none;
  margin-top: -1px;
  vertical-align: middle;
  color: #8595a1;
  font-size: 70%;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.dataset-value > .value-option:hover {
  color: #3480ac;
}

.dataset-value > .value-option:active {
  color: #1c465e;
}

.dataset-value.active {
  cursor: pointer;
}

.dataset-value.active:hover {
  margin: -1px -4px;
  padding: 0px 3px;
  color: #3480ac;
  border: 1px solid #3480ac;
}

.dataset-value.active:hover > .value-option {
  display: inline-block;
}

.dashboard-column-divider {
  position: absolute;
  top: 0px;
  bottom: 0px;
  width: 4px;
}

.dashboard-column-divider > div {
  position: absolute;
  left: -4px;
  width: 8px;
  top: 0px;
  bottom: 0px;
  background-color: #d1d4d5;
  cursor: col-resize;
}

.dashboard-row-divider {
  position: absolute;
  left: 0px;
  right: 0px;
  height: 4px;
}

.dashboard-row-divider > div {
  position: absolute;
  top: -4px;
  height: 8px;
  left: 0px;
  right: 0px;
  background-color: #d1d4d5;
  cursor: row-resize;
}

.dashboard-cell:hover,
.dashboard-cell.active {
  background-color: #dae5ff;
}

.dashboard-area {
  pointer-events: none;
}

.dashboard-placement {
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  bottom: 0px;
  margin: 8px;
  background-color: #fff;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  border: 1px solid #e2e5e6;
  pointer-events: all;
  display: flex;
  flex-direction: column;
}

.dashboard-details-area {
  box-sizing: border-box;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #AAAAAA90;
  z-index: 500;
}

.dashboard-details-area .dashboard-placement {
  left: 60px;
  right: 60px;
  top: 60px;
  bottom: 60px;
}

.dashboard-measure-content {
  position: absolute;
  left: 14px;
  top: 14px;
  right: 14px;
  bottom: 14px;
}

.board {
  display: flex;
  flex-direction: row;
  width: 100%;
  height: 100%;
  overflow-y: hidden;
  overflow-x: auto;
}

.board-column {
  display: block;
  width: 25%;
  flex-shrink: 0;
  padding-top: 8px;
  padding-bottom: 4px;
  padding-left: 4px;
  padding-right: 4px;
  box-sizing: border-box;
}

.board-column:first-child {
  padding-left: 8px;
}

.board-column:last-child {
  padding-right: 8px;
}

.board-column .board-panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: #fff;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}

.board-column .board-caption {
  color: #abaeaf;
  font-size: 90%;
  text-align: center;
  margin-top: 2px;
  margin-left: 2px;
  margin-right: 2px;
  padding: 2px;
  -moz-border-radius-topleft: 6px;
  -webkit-border-top-left-radius: 6px;
  border-top-left-radius: 6px;
  -moz-border-radius-topright: 6px;
  -webkit-border-top-right-radius: 6px;
  border-top-right-radius: 6px;
}

.board-column .board-caption.active {
  color: #dc4f77;
}

.board-column .board-caption.with-bottom-border {
  border-bottom: 1px solid #f5f5f5;
}

.board-column .board-content {
  flex-grow: 1;
  overflow-y: auto;
}

.board-column .board-card {
  margin: 4px;
  padding: 4px;
  min-height: 12px;
  border: 1px solid #e2e5e6;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: -1px 1px 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: -1px 1px 1px 1px rgba(0, 0, 0, 0.05);
}

.board.board-columns-3 {
  justify-content: space-evenly;
}

.board.board-columns-3 .board-column {
  width: 33%;
}

.edit {
  position: relative;
  display: inline-block;
  min-width: 80px;
}

.edit .option-button {
  position: absolute;
  right: 1em;
  top: 2px;
  padding: 0px 10px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  font-size: 90%;
  color: #455D79;
  background-color: #d7f1ff;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
}

.edit .option-button.muted {
  backgroun-color: #d4dadc;
}

.edit .option-button:not(.readonly):hover {
  background-color: #a4dfff;
}

.edit .option-button:not(.readonly):active {
  background-color: #455D79;
  color: #d7f1ff;
}

.edit .option-dropdown {
  position: absolute;
  right: 1em;
  top: 2px;
  z-index: 1000;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  font-size: 90%;
  background-color: #d7f1ff;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
}

.edit .option-dropdown .option {
  padding: 1px 8px;
}

.edit .option-dropdown .option:hover {
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  background-color: #a4dfff;
}

.edit:not(.link) {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #e2e5e6;
}

.edit:not(.link) input,
.edit:not(.link) input:focus,
.edit:not(.link) input:disabled,
.edit:not(.link) input:invalid {
  outline: none;
  border: none;
}

.edit:not(.link):focus-within {
  border: 1px solid #5d9cec;
}

.edit .link {
  color: #1c65cb;
}

.edit .buttons {
  position: absolute;
  right: 0.6em;
  bottom: 4px;
  color: #dc4f77;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.edit .buttons .fa-pencil {
  margin-bottom: 4px;
}

.edit .buttons .fa-caret-down,
.edit .buttons .fa-caret-up {
  font-size: 110%;
}

.edit .buttons > * {
  cursor: pointer;
}

.edit .buttons > *.muted {
  color: #d4dadc;
}

.edit .buttons > *:hover {
  color: #F9B233;
}

.edit .buttons > *:active {
  color: #dc4f77;
}

.edit .drop-button {
  position: absolute;
  right: 0px;
  bottom: 0px;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  color: #060606;
}

.edit .hidden-button {
  display: none;
}

.edit:hover .hidden-button,
.edit:focus-within .hidden-button {
  display: block;
}

.edit .edit-drop-down {
  position: absolute;
  top: 100%;
  left: 0px;
  min-width: 100%;
  max-height: 300px;
  z-index: 100;
  overflow-y: auto;
  background-color: #fff;
  border: 1px solid #f3f3f3;
  -webkit-box-shadow: 3px 3px 3px #ddd;
  box-shadow: 3px 3px 3px #ddd;
}

.edit .edit-drop-down .option {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  padding: 1px 4px;
}

.edit .edit-drop-down .option.highlight {
  background-color: #1e90ff;
  color: #fff;
}

.unit-edit input {
  width: 120px !important;
}

.view-bar .fields {
  margin-top: 4px !important;
  margin-top: 5px !important;
}

.fields {
  margin-left: 24px;
  margin-right: 24px;
  margin-top: 12px;
}

.fields .static > div:empty:after,
.field-style .static > div:empty:after {
  content: '\200b';
}

.fields.small,
.field-style.small {
  font-size: 80%;
}

.fields .block,
.field-style .block {
  display: inline-block;
  margin-left: 24px;
  margin-right: 24px;
}

.fields .edit,
.field-style .edit {
  border: none;
}

.fields .edit:focus-within,
.field-style .edit:focus-within {
  border: none;
}

.fields .edit .buttons,
.field-style .edit .buttons {
  right: 0.4em;
  bottom: 6px;
  font-size: 85%;
}

.fields .input,
.field-style .input {
  border: none;
}

.fields input,
.field-style input,
.fields .static,
.field-style .static {
  color: #012C3D;
  outline: none;
  position: relative;
  font-size: 115%;
  padding-top: 0px;
  padding-bottom: 4px;
  padding-right: 1em;
  text-indent: 0px;
  border: none;
  min-width: 120px;
  max-width: 345px;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  border-bottom: 1px solid #d4dadc !important;
}

.fields input[type="checkbox"],
.field-style input[type="checkbox"] {
  min-width: auto;
}

.fields .edit.short,
.field-style .edit.short,
.fields .edit.very-short,
.field-style .edit.very-short {
  min-width: 10px;
}

.fields .edit.short input,
.field-style .edit.short input {
  min-width: 30px;
  max-width: 60px;
}

.fields .edit.very-short input,
.field-style .edit.very-short input {
  min-width: 10px;
  max-width: 30px;
}

.fields .edit.editing input,
.field-style .edit.editing input {
  padding-right: 1.8em;
}

.fields input:focus,
.field-style input:focus {
  border: none;
  border-bottom: 2px solid #5d9cec !important;
  padding-bottom: 3px;
  color: #060606;
}

.fields .static:focus,
.field-style .static:focus {
  border: none;
  border-bottom: 2px solid #d4dadc;
  padding-bottom: 3px;
  color: #060606;
}

.fields input:disabled .static.disabled,
.field-style input:disabled .static.disabled {
  padding-bottom: 1px;
  background-color: #fbfbfb;
  border: none;
  border-bottom: 1px solid #d4dadc !important;
  color: #979ea1;
}

.fields input:invalid,
.field-style input:invalid,
.fields input.error,
.field-style input.error,
.fields .static.error,
.field-style .static.error {
  border: none;
  border-bottom: 1px solid #f05050 !important;
}

.fields input:invalid:focus,
.field-style input:invalid:focus,
.fields input.error:focus,
.field-style input.error:focus {
  border: none;
  border-bottom: 2px solid #f05050 !important;
  padding-bottom: 3px;
}

.field {
  position: relative;
  display: block;
  vertical-align: top;
  margin-right: 28px;
  margin-bottom: 12px;
}

.field .caption {
  display: block;
  margin-bottom: 4px;
}

.field .control > .edit {
  width: 100%;
}

.field.short input,
.field.short .static {
  width: 120px;
}

.field .field-comment {
  position: absolute;
  left: 4px;
  margin-top: -4px;
  top: 100%;
  font-size: 85%;
}

.field .field-comment.danger {
  color: #f05050;
}

.form.small {
  font-size: 80%;
}

.form input,
.form .static {
  color: #012C3D;
  background-color: transparent;
  outline: none;
  position: relative;
  font-size: 115%;
  padding-top: 0px;
  padding-bottom: 4px;
  padding-right: 1em;
  text-indent: 0px;
  border: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  border-bottom: 1px solid #d4dadc;
}

.form .edit.editing input {
  padding-right: 1.8em;
}

.form input:focus {
  border: none;
  border-bottom: 2px solid #5d9cec;
  padding-bottom: 3px;
  color: #060606;
}

.form .static:focus {
  border: none;
  border-bottom: 2px solid #d4dadc;
  padding-bottom: 3px;
  color: #060606;
}

.form input:disabled .static.disabled {
  padding-bottom: 1px;
  background-color: #fbfbfb;
  border: none;
  border-bottom: 1px solid #d4dadc;
  color: #979ea1;
}

.form .modified input,
.form .modified .static {
  border: none;
  border-bottom: 1px solid #fad0a5 !important;
}

.form .modified input:focus,
.form .modified .static:focus {
  border-bottom: 2px solid #fad0a5 !important;
}

.form input:invalid,
.form input.error,
.form .static.error {
  border: none;
  border-bottom: 1px solid #f05050 !important;
}

.form input:invalid:focus,
.form input.error:focus {
  border: none;
  border-bottom: 2px solid #f05050 !important;
  padding-bottom: 3px;
}

.form input.error {
  border-bottom: 2px solid #f05050 !important;
}

.title > .edit input {
  border-bottom: none !important;
  margin-bottom: -2px;
  padding-bottom: 4px;
  max-width: none;
  box-sizing: border-box;
  width: 100%;
}

.title > .edit input:invalid,
.title > .edit input.error {
  padding-bottom: 3px;
  border-bottom: 1px solid #f05050 !important;
}

.title > .edit input:focus {
  border-bottom: 2px solid #5d9cec !important;
  padding-bottom: 2px;
  color: #060606;
}

.title > .edit input:focus:invalid,
.title > .edit input:focus.error {
  border-bottom: 2px solid #f05050 !important;
}

.title > .edit.error input {
  padding-bottom: 3px;
  border-bottom: 1px solid #f05050 !important;
}

.title > .edit.error input:focus {
  padding-bottom: 2px;
  border-bottom: 2px solid #f05050 !important;
}

.task-levels .task-level {
  position: relative;
  border-bottom: 1px solid #e2e5e6;
  height: 24px;
}

.task-levels .task-time {
  position: absolute;
  top: 6px;
  bottom: 0px;
  min-width: 2px;
  border-left: 1px solid #e2e5e6;
  border-right: 1px solid #e2e5e6;
  color: #455D79;
  font-size: 90%;
  white-space: nowrap;
}

.task-levels .task-time.active {
  border-left: 1px solid #455D79;
  border-right: 1px solid #455D79;
}

.task-levels .task-time .info {
  margin: 2px 4px;
}

.task-levels .task {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: absolute;
  top: 1px;
  bottom: 1px;
  border: 1px solid #fff;
  background-color: #455D79;
  color: #fff;
  overflow: hidden;
  white-space: nowrap;
}

.task-levels .task.point-left {
  background-color: transparent;
  color: #455D79;
  text-align: right;
}

.task-levels .task.point-right {
  background-color: transparent;
  color: #455D79;
}

.task-levels .task.active {
  background-color: #F9B233;
  color: #fff;
}

.task-levels .task.mark {
  width: 8px !important;
  margin-left: -4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.task-levels .task .info {
  margin: 2px 4px;
}

.form {
  position: relative;
}

.form.changed {
  background-color: #f7f0de;
}

.form .form-buttons {
  position: absolute;
  right: 8px;
  bottom: 8px;
}

.form .form-buttons > *:not(:last-child) {
  margin-right: 8px;
}

@media print {
  .chart-axis {
    font-size: 130%;
  }

  .config-panel {
    display: none !important;
  }

  .navbar-header {
    display: none !important;
  }
}
/* cyrillic-ext */

@font-face {
  font-family: 'IBM Plex Sans Thin';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(/v/fonts/zYX-KVElMYYaJe8bpLHnCwDKjbLuGqZJSdY.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */

@font-face {
  font-family: 'IBM Plex Sans Thin';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(/v/fonts/zYX-KVElMYYaJe8bpLHnCwDKjbLuE6ZJSdY.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek */

@font-face {
  font-family: 'IBM Plex Sans Thin';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(/v/fonts/zYX-KVElMYYaJe8bpLHnCwDKjbLuFKZJSdY.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}

/* vietnamese */

@font-face {
  font-family: 'IBM Plex Sans Thin';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(/v/fonts/zYX-KVElMYYaJe8bpLHnCwDKjbLuGKZJSdY.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */

@font-face {
  font-family: 'IBM Plex Sans Thin';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(/v/fonts/zYX-KVElMYYaJe8bpLHnCwDKjbLuGaZJSdY.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */

@font-face {
  font-family: 'IBM Plex Sans Thin';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(/v/fonts/zYX-KVElMYYaJe8bpLHnCwDKjbLuF6ZJ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  src: local('IBM Plex Sans'), local('IBMPlexSans'), url(/v/fonts/zYXgKVElMYYaJe8bpLHnCwDKhdzeFb5N.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  src: local('IBM Plex Sans'), local('IBMPlexSans'), url(/v/fonts/zYXgKVElMYYaJe8bpLHnCwDKhdXeFb5N.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek */

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  src: local('IBM Plex Sans'), local('IBMPlexSans'), url(/v/fonts/zYXgKVElMYYaJe8bpLHnCwDKhdLeFb5N.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}

/* vietnamese */

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  src: local('IBM Plex Sans'), local('IBMPlexSans'), url(/v/fonts/zYXgKVElMYYaJe8bpLHnCwDKhd7eFb5N.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  src: local('IBM Plex Sans'), local('IBMPlexSans'), url(/v/fonts/zYXgKVElMYYaJe8bpLHnCwDKhd_eFb5N.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  src: local('IBM Plex Sans'), local('IBMPlexSans'), url(/v/fonts/zYXgKVElMYYaJe8bpLHnCwDKhdHeFQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(/v/fonts/SourceSansPro-Regular.ttf) format('ttf');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(/v/fonts/SourceSansPro-Regular.ttf) format('ttf');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(/v/fonts/SourceSansPro-Regular.ttf) format('ttf');
  unicode-range: U+1F00-1FFF;
}

/* greek */

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(/v/fonts/SourceSansPro-Regular.ttf) format('ttf');
  unicode-range: U+0370-03FF;
}

/* vietnamese */

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(/v/fonts/SourceSansPro-Regular.ttf) format('ttf');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(/v/fonts/SourceSansPro-Regular.ttf) format('ttf');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(/v/fonts/SourceSansPro-Regular.ttf) format('ttf');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}