body {
  font-size: 11px !important;
  --header-height: 34px;
  --modal-padding: 50px;
}
.ohke-popup-success{color:#fff!important;background-color:#4CAF50!important}
.ohke-popup-warning{color:#000!important;background-color:#ffeb3b!important}
.ohke-popup-info{color:#fff!important;background-color:#2196F3!important}
.ohke-popup-error{color:#fff!important;background-color:#f44336!important}

.highlight_zone {
  background:white;
}

.ohke-data-template {
  display: none;
}

.hide-empty-form {
  display: none !important;
}

.ohke-error-control {
  box-shadow: 0 0 4px var(--red) !important;
}

.ohke-image-container input[type=file] {
  display: none;
}

.ohke-image-container .w3-btn {
  font-weight: normal;
}

.ohke-image-container .title {
  padding: 6px;
  overflow: hidden;
}

.w3-modal-content {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  border-radius: 6px;
  overflow: hidden;
}

@media (min-width: 601px) {
  .right-label {
    text-align: right;
    padding-right: 8px;
    padding-top: 4px;
  }
}

.padding-4 {
  padding: 4px 8px
}

.ohke-image-container .img-data {
  min-height: 200px;
  max-height: 400px;
  max-width: 100%;
}

.ohke-order.w3-input {
  border-radius: 6px;
  width: 50px;
  padding: 4px;
  text-align: center;
  border: 1px solid #ccc;
}

.ohke-invalid .w3-input, .ohke-invalid .chosen-single, .ohke-invalid .chosen-choices, .ohke-invalid .number-group-input {
  box-shadow: 0 0 4px var(--red) !important;
}
.ohke-invalid .number-group-input .w3-input{
  box-shadow: none !important;
}

.ohke-invalid .invalid-message, .invalid-form.invalid-message {
  color: var(--red);
  list-style-type: none;
  padding: 0;
  margin: 2px 0;
}

.invalid-form.invalid-message{
  padding-left: 8px;
}

.ohke-invalid .invalid-message > li:before, .invalid-form.invalid-message > li:before {
  content: "\f071";
  margin-right: 6px;
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

.padding-12 {
  padding: 12px 0;
  margin: 0;
}

.icon-list img {
  max-height: 50px !important;
}

.photo-item.active {
  color: red;
}

.ohke-btn.transition-btn {
  margin-top: 6px;
}

.ohke-radio {
  min-height: 27px;
  display: flex;
}

.ohke-radio > label {
  display: flex;
  align-items: center;
  flex: 1;
  font-weight: normal !important;
  padding-right: 6px;
}

.ohke-radio > label > input {
  margin-right: 6px;
}

.main-tab {
  margin: 0;
  height: 100%;
  overflow: hidden;
}

.main-tab > .tab-header {
  padding-left: 4px;
}

.main-tab > .tab-header > .close-btn {
  margin: 5px;
}

.main-tab > .tab-content {
  border: none !important;
  height: calc(100% - 36px);
  overflow-y: auto;
}

.ohke-tab{
  width: 100%;
}
.ohke-tab .tab-item > .subform-container {
  border: none !important;
  min-height: inherit !important;
  border-radius: 0 !important;
}

.subform-container .ohke-table {
  border: none;
}

.subform-container .ohke-table > tbody tr:last-child {
  border-bottom: none !important;
}

.title .record-title {
  padding-right: 20px
}
.title .bar-left{
  border-left: 1px solid var(--white);
}
.title .bar-right{
  border-right: 1px solid var(--white);
}
.title .record-info {
  font-size: 11px;
  padding: 0 3px;
}

.title .record-info b {
  color: #fbc02d;
}

.ohke-panel .panel-header .fa {
  line-height: unset !important;
}

.ohke-panel .panel-header .ohke-btn {
  font-size: 11px;
}

.ohke-panel .panel-header {
  width: 100%;
  height: 26px;
  overflow: hidden;
  color: var(--white);
  background: var(--main-color);
  text-align: center;
  user-select: none;
  font-size: 15px;
  padding-top: 4px;
  border-radius: 6px 6px 0 0;
}

.ohke-panel .panel-content {
  padding-bottom: 2px;
  border-color: var(--main-color);
  border-width: medium thin thin thin;
  border-style: solid;
  border-radius: 0 0 6px 6px;
  background: var(--white);
}

.ohke-badge {
  border-radius: 6px;
  display: inline-block;
  text-align: center;
  padding: 0 4px 1px;
  color: #fff;
  background: var(--red);
  font: 10px Verdana, sans-serif;
  white-space: nowrap;
}

.height-35 {
  height: 35px;
}

.no-resize {
  width: 100% !important;
}

.no-wrap {
  white-space: nowrap;
}

.no-margin {
  margin: 0 !important;
}

.ohke-header {
  background: var(--main-color);
  color: var(--white);
  height: 34px;
  padding: 0 8px;
  border-radius: 6px 6px 0 0;
}

.wizard-header > div {
  padding-top: 5px;
}

.ohke-header .title {
  font-size: 11px!important;
  padding-top: 8px;
  overflow: hidden;
}

.ohke-header .action .ohke-btn:first-child {
  margin-left: 8px;
}

.ohke-header .action {
  float: right;
  padding-top: 5px;
}

.ohke-header .w3-btn, .ohke-content .w3-btn {
  padding: 5px 10px;
  background: #55a4f8;
  border-radius: 6px;
}

.ohke-table {
  font-size: 11px !important;
}

.ohke-table.agent-list {
  margin-bottom: 2px;
}

.ohke-table.agent-list .code-container {
  max-width: 800px;
}

.ohke-table.agent-list > tbody > tr:hover {
  box-shadow: inset 0 0 10px green;
}

.ohke-table.agent-list.no-shadow-me > tbody > tr:hover {
  box-shadow: none !important;
}

.ohke-table.agent-list.no-shadow-all tr:hover {
  box-shadow: none !important;
}

.ohke-table > tbody > tr.latest > td:first-child, .ohke-table > tbody > tr.last-item > td:first-child {
  background: url(/appstart/resource/common/images/new_icon.gif) no-repeat;
  background-size: 85%;
}

.ohke-table > thead > tr > th, .ohke-table > tbody > tr > td {
  padding: 8px 4px;
}

.ohke-btn {
  border-radius: 6px;
  background: var(--light-color);
  color: var(--white);
  padding: 4px 12px;
  display: inline-block;
  width: auto;
  user-select: none;
  vertical-align: middle;
  overflow: hidden;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
}

.ohke-btn + .ohke-btn, .ohke-btn + .ohke-btn-group, .ohke-btn-group + .ohke-btn {
  margin-left: 5px;
}

.ohke-btn:first-child {
  margin-left: 0;
}

.ohke-btn:focus, .ohke-btn:active, .close-btn:focus, .close-btn:active {
  outline: none;
  box-shadow: 0 0 5px var(--active-color);
}

.ohke-btn:hover {
  background: var(--hover-color);
  opacity:1;
}

.danger {
  color: #fff !important;
  background-color: var(--red) !important
}

.danger2 {
  color: var(--red) !important;
  background: var(--white) !important;
  border: 1px solid #ccc;
}

.danger:hover,.danger2:hover {
  color: #fff !important;
  background-color: var(--red-hover) !important
}

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

.warning:hover {
  color: #fff !important;
  background-color: #f4ad25 !important
}

.ohke-group > * {
  border-radius: 0;
  margin: 0;
  border-left-width: 0 !important;
}

.ohke-group > *:first-child {
  border-top-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
}

.ohke-group > *.w3-border:first-child, .ohke-group > *.ohke-box:first-child {
  border-left-width: 1px !important;
}

.ohke-group > *:last-child {
  border-top-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
}

.ohke-group {
  display: flex;
}

.ohke-group .w3-input, .ohke-group .search-box {
  flex: 1;
  /*width: inherit;*/
}
select.w3-input.inp-state{
  max-width: 150px
}
.ohke-group .ohke-box {
  flex: 1;
  border-radius: inherit;
}
.ohke-group-space {
  display: flex;
}
.ohke-group-space > * {
  margin-left: 6px;
}
.ohke-group-space > *:first-child {
  margin-left: 0;
}
td > .ohke-group-space .ohke-box{
  border: none;
  padding: 0;
}
.flex {
  flex: 1
}
.ohke-header .w3-btn, .ohke-header .ohke-btn, .ohke-header .w3-input {
  height: 25px !important;
}

.ohke-header .state-filter {
  float: left;
  padding-top: 5px;
  margin-right: 10px;
  display: flex;
}

.ohke-header .state-filter select:first-child {
  margin-left: 0;
}

.ohke-header .state-filter select {
  padding: 0 4px;
  margin-left: 10px;
}

.ohke-header .state-filter-2 {
  display: inline-flex;
}

.ohke-header .state-filter-2 .w3-input {
  border-left: 1px solid #ccc !important;
  padding: 0 4px;
}

.ohke-header .w3-input:focus {
  outline: none;
}

.ohke-header .search .w3-input {
  background: #fff !important;
  color: #222 !important;
  border: none;
}

.tab-item .ohke-header > .search, .tab-item .ohke-header > .action {
  padding-top: 3px;
}

.ohke-header .search {
  padding-top: 5px;
  overflow: hidden;
}

.ohke-header .search .search-box {
  width: 100%;
  position: relative;
}

.ohke-header .search .search-box .total {
  position: absolute;
  right: 5px;
  top: 2px;
  bottom: 2px;
  color: #333;
  background: #e6e6e6;
  padding: 2px 5px;
  border-radius: 6px;
  display: flex;
  align-items: flex-end;
}
.search-box.search2 input {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  padding-left: 25px;
}
.search-box.search2 a > div {
  width: 20px;
  height: 20px;
  background: lightgray;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.search-box.search2 a {
  position: absolute;
  top: 0;
  cursor: pointer;
  color: var(--white);
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.close-btn {
  border-radius: 6px;
  color: var(--white);
  display: inline-block;
  vertical-align: middle;
  overflow: hidden;
  text-decoration: none;
  cursor: pointer;
  margin-left: 10px;
}

.close-btn:hover {
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.subform-container .ohke-content, form.ohke-content {
  min-height: 6px;
}

.ohke-content {
  padding-bottom: 4px;
}
.main-container > .agent-container > .ohke-content{
  padding-bottom: 0;
}

.main-container > .agent-container {
  height: 100%;
}

.main-container > .agent-container > .ohke-header ~ .ohke-content, .ohke-header ~ .full-height {
  height: calc(100% - 34px) !important;
  overflow: hidden auto;
}

.main-tab > .tab-content > div > .ohke-header,
.no-round-top > .agent-container > .ohke-header,
.no-round-top > .agent-body > .agent-container > .ohke-header,
.no-round-top .wizard-header,
.main-container > .agent-container > .ohke-header,
.tab-item > div.dynamic-content > .agent-container > .ohke-header,
.tab-item > div.dynamic-content > .agent-body > .agent-container > .ohke-header
{
  border-radius: 0;
}

.tab-item > div.dynamic-content > .agent-container > .ohke-header,
.tab-item > div.dynamic-content > .agent-body > .agent-container > .ohke-header
{
  margin: -4px -1px 0 -1px;
}
.nav-left > .tab-content > .tab-item > div.dynamic-content > .agent-body > .agent-container > .ohke-header,
.nav-right > .tab-content > .tab-item > div.dynamic-content > .agent-body > .agent-container > .ohke-header{
  margin: 0;
}
.agent-body, .agent-loader{
  height: 100%;
}
.agent-loader{
  position: relative;
  min-height: 50px;
}
.ohke-border {
  border: 1px solid var(--main-color);
}
.ohke-border > .agent-container > .ohke-header {
  margin: -1px -1px 0 -1px;
}
.main-container > .agent-container > .ohke-content {
  overflow: hidden auto;
  height: 100%;
}

.subform-container {
  min-height: 144px;
}

.dynamic-content {
  min-height: 32px;
}

.w3-input[readonly], .ohke-box.readonly {
  background-color: #f1f1f1 !important;
}

.w3-input[type=number] {
  max-width: 175px;
  text-align: right;
}

.w3-input[type=date], .w3-input[type=datetime-local], .w3-input[type=time] {
  max-width: 200px;
}
.s12 > .w3-input{
  max-width: unset !important;
}

.ohke-content:before { /*Fix margin-top for top children*/
  content: ' ';
  display: block;
  width: 100%;
  height: .001em;
}

.ohke-content .w3-input[type=text] {
  height: 27px;
  background: white;
  color: black;
}

.ohke-content .chosen-container{
  background: white;
  color: black;
}

.ohke-content .area-readonly {
  min-height: 28px;
}

.ohke-content .chosen-single {
  height: 27px !important;
  background: white !important;
}

.ohke-content .chosen-choices {
  background-image: none !important;
}

.img-circle {
  border-radius: 50%;
}

.align-middle {
  display: flex;
  align-items: center;
}

.w3-dropdown-check:checked ~ .w3-dropdown-content {
  display: block;
}

.ohke-dashboard {
  min-height: calc(100% - 58px);
  overflow: auto;
}

.ohke-dashboard .box-stat {
  font: 11px Arial, Serif;
  height: 60px;
  background: white;
  padding: 0;
}

.ohke-dashboard .box-stat > div {
  float: right;
  width: calc(100% - 65px);
}

.ohke-dashboard .box-stat > .icon {
  color: white;
  float: left;
  display: inline-block;
  font-size: 40px;
  padding-top: 7px;
  width: 60px;
  height: 60px;
  text-align: center;
}

.ohke-dashboard .box-stat .value {
  font-weight: bold;
  margin-bottom: 5px;
}

.ohke-dashboard .box-stat .label {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-transform: uppercase;
}

.ohke-dashboard .chart {
  margin-bottom: 16px;
}

.ohke-dashboard .chart .w3-card {
  padding: 10px;
}

.ohke-dashboard .chart .title {
  font-size: 15px;
  font-weight: bold;
  margin-bottom: 10px;
  border-bottom: medium solid seagreen;
}

.ohke-dashboard .chart canvas {
  width: 100%;
}

.no-outline {
  outline: none !important;
}

.ui-datepicker {
  width: 280px !important;
}

.ui-datepicker-calendar th {
  width: 14.28%;
}

.ui-datepicker-week-end .ui-state-default {
  color: red;
}

.ui-datepicker-week-end {
  color: red;
}

.chosen-container .chosen-choices {
  padding: 8px !important;
}

.ohke-content .chosen-disabled {
  opacity: 1 !important;
}

.ohke-content .chosen-disabled .chosen-single {
  background: var(--white) !important;
}

.ohke-content .chosen-disabled .chosen-choices .search-choice {
  padding-right: 5px !important;
}

.ohke-content .chosen-disabled .chosen-choices .search-choice .search-choice-close,
.ohke-content .chosen-disabled .ohke-single-close{
  display: none !important;
}

.chosen-container .chosen-choices {
  padding: 4px !important;
  border: thin solid #ccc !important;
  border-radius: 6px;
}

.chosen-container, .chosen-container .search-choice {
  font-size: 11px !important;
  border-radius: 6px !important;
}

.chosen-container-active .chosen-choices, .chosen-container-active .chosen-single, .w3-input:focus {
  -webkit-box-shadow: 0 0 5px var(--active-color) !important;
  box-shadow: 0 0 5px var(--active-color) !important;
  outline: 0 !important;
}

.ui-autocomplete-group {
  font-weight: bold;
  padding: .2em .4em;
  margin: .8em 0 .2em;
  line-height: 1.5;
}

.ui-menu.ui-autocomplete {
  max-height: 150px;
  overflow: hidden auto;
}

.ui-autocomplete-input {
  padding: 2px 5px;
  width: calc(100% - 16px);
}

.ui-autocomplete-clear {
  cursor: pointer;
  margin-left: 5px;
}

.w3-bar.state .w3-bar-item {
  border-left: 1px dotted white;
}

.w3-bar.state .w3-bar-item:first-child {
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
  border-left: none !important;
}

.w3-bar.state .w3-bar-item:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

input:checked + .check {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' focusable='false' version='1.1' viewBox='0 0 24 24' style='background:%2300ad40'%3E%3Cpath d='M4.1,12.7 9,17.6 20.3,6.3' fill='none' stroke='white' stroke-width='2'%3E%3C/path%3E%3C/svg%3E");
  background-size: cover;
}
.circle input + .check {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' focusable='false' version='1.1' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23f7f7f7' stroke='%2300ad40' stroke-width='2'/%3E%3C/svg%3E");
  background-size: cover;
  background-color: transparent;
  border: none;
}
.circle input:checked + .check {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' focusable='false' version='1.1' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23f7f7f7' stroke='%2300ad40' stroke-width='2'/%3E%3Ccircle cx='12' cy='12' r='7'%0Afill='%2300ad40' stroke='%2300ad40'/%3E%3C/svg%3E");
  background-size: cover;
  background-color: transparent;
  border: none;
}

.app-state {
  cursor: pointer;
}

.app-state .fa {
  margin: 5px 0 0 !important;
  font-size: 15px !important;
  width: 20px !important;
  height: 20px !important;
}

.main-container-out {
  position: absolute;
  top: 58px;
  bottom: 0;
  right: 0;
  left: 0;
  border: 0;
  z-index: 1;
  -webkit-transition: -webkit-transform .3s ease-in-out, width .3s ease-in-out;
  -moz-transition: -moz-transform .3s ease-in-out, width .3s ease-in-out;
  -o-transition: -o-transform .3s ease-in-out, width .3s ease-in-out;
  transition: transform .3s ease-in-out, width .3s ease-in-out
}

@media (max-width: 600px) {
  .main-container-out {
    top: 80px;
    bottom: 0;
  }
}

.main-container {
  position: relative;
  height: 100%;
  overflow: auto;
}

.main-footer {
  height: 40px;
  color: #222d32;
}

.main-footer .info {
  padding: 3px 5px 0 5px;
}

.login-screen {
  margin: auto;
  padding: 0;
  border: 0;
  background-size: cover !important;
}

.login-screen.default {
  background: url(/appstart/resource/common/images/background5.jpg) no-repeat;
}

.login-form .inside-icon {
  float: left;
  margin-top: -25px;
  margin-left: 10px;
  color: gray;
  font-size: 13px;
}

.login-form .w3-input {
  padding: 8px 12px 8px 30px;
  box-shadow: 0 0 5px gray;
}

.login-form .w3-input, .login-form .ohke-btn {
  border-radius: 6px;
  margin-top: 16px;
  font: 11pt Verdana, sans-serif !important;
  height: 37px;
}

.login-form .ohke-btn {
  border: 0;
  width: 100%;
}

.login-form .site-name {
  font: 18pt Arial, sans-serif !important;
  font-weight: bold;
  color: var(--white);
}

.login-form .block {
  margin-bottom: 32px;
  text-align: center;
}

.login-form .copyright {
  font-size: 16px;
  text-shadow: 0 0 2px var(--white);
}

.login-form .logo {
  height: 100px;
  margin-bottom: 8px;
  max-width: 100%;
}

.login-form .logo.circle {
  border-radius: 50%;
}

.login-form .message {
  font-size: 13px;
  color: var(--red);
  text-shadow: 0 0 2px black;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background-color: #f5f5f5;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  border-radius: 5px;
  background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 3px rgba(45, 97, 167, .3);
  background-color: #92b6cc;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--main-color);
}

.ohke-richtext ~ .tox-tinymce {
  border-radius: 6px;
}

.top-bar #working_site_name_top_toolbar {
  height: 58px;
  background-color: var(--main-color);
  border-bottom: 1px dotted #616161;
}

.top-bar a {
  text-decoration: none;
}

.top-bar img, .top-bar i.fa {
  float: left;
  height: 38px;
  border-color: #fff;
  font-size: 20px;
  text-align: center;
  margin-right: 6px;
  border-radius: 4px;
}

.top-bar .alert-btn {
  z-index: 99;
  position: fixed;
  right: 30px;
  bottom: 30px;
  width: 44px;
  height: 44px;
  background: white;
  border-radius: 50%;
  padding: 2px;
}

.top-bar .alert-btn a {
  position: relative;
}

.top-bar .alert-btn span {
  position: absolute;
  right: 4px;
  top: 4px;
}

.top-bar .alert-btn:hover .fa {
  font-size: 36px;
  color: #005dd6;
}

.top-bar .alert-btn .fa {
  font-size: 35px;
  width: unset;
  height: unset;
}

.top-bar .w3-bar-item {
  padding: 8px !important;
}

.top-bar .flag {
  width: unset;
  border-radius: 0;
  height: 24px;
  margin-top: 5px;
}

.top-bar .w3-dropdown-click {
  background-color: var(--main-color);
}

.top-bar .working-site-list {
  overflow: hidden auto;
  max-height: 80%;
  width: 600px;
  z-index: 10000;
  top: 58px;
}

.top-bar .working-site-list.small {
  overflow: hidden auto;
  height: 80%;
  width: calc(100% - 20px);;
  z-index: 10000;
}

.top-bar .worker-action-list {
  top: 58px;
  right: 0;
  overflow: hidden auto;
  max-height: 80%;
  width: 250px;
  z-index: 10000;
}

@media (max-width: 600px) {
  .top-bar .worker-action-list {
    top: 75px;
  }
}

.top-bar #waitingAppList {
  overflow: hidden auto;
  max-height: 80%;
  width: 300px;
  z-index: 10000;
  border-radius: 4px;
  top: 58px;
}

.top-bar #platform_toolbar_top {
  height: 58px;
  background-color: var(--main-color);
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.top-bar #buttonWorkingSiteName {
  background-color: var(--main-color);
  border: none;
  display: block;
  text-align: center;
  height: 24px
}

.top-bar #working_site_name_top_toolbar .w3-bar-item {
  background-color: var(--main-color);
  width: 100%;
  height: 100%;
}

.top-bar .w3-button {
  display: flex;
  text-decoration: none;
  text-align: left;
  align-items: center;
}

.top-bar .w3-input {
  width: calc(100% - 32px);
  margin: 16px;
}

.top-bar .w3-dropdown-click > a .title {
  font: 11px Arial, sans-serif;
  padding-top: 14px;
  color: white;
  font-weight: 700;
}

.top-bar .title {
  padding: 4px 0;
  display: inline-block;
}

.zoom-6 {
  font-size: 9pt;
}

.break-all {
  word-break: break-all;
  white-space: normal;
}

.map-list {
  padding: 0;
  list-style: none;
}

.map-list li .value {
  text-align: right;
  font-weight: bold;
}

.map-list li .label {
  font-size: 90%;
  opacity: 0.7;
}

.map-list li {
  display: table-row;
}

.map-list li > * {
  display: table-cell;
  padding-right: 10px;
}

.btn-upload:hover {
  color: var(--white);
  background: #55a4f8 !important;
}

.btn-upload {
  text-shadow: 0 0 3px white;
  background: rgba(85, 164, 248, 0.3) !important;
  float: left;
  color: black;
  margin-right: 6px;
}
.ohke-file-container .service{
  float: left;
  margin-right: 6px;
}

.error-container {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  background: var(--white);
  /*background: radial-gradient(circle, var(--white) 20%, #86addf 100%);*/
  border-radius: 6px;
}

.error-container .fa {
  display: block;
  font-size: 100px;
}

.error-container .inner {
  margin: 50px;
  text-align: center;
  color: var(--red);
}

.full-height {
  height: 100%;
  overflow: auto;
}

.ohke-f-box{
  height: 100%;
  overflow-y: auto;
}
.ohke-v-box{
  display: flex;
  flex-direction: column;
}

.ohke-h-box{
  display: flex;
  flex-direction: row;
}
.ohke-h-box.w3-right-align,.ohke-v-box.w3-right-align{
  justify-content: flex-end;
}
.ohke-v-box > .control, .ohke-h-box > .control{word-break: break-word;}
.ohke-v-box > .label{font-weight: bold;}
.ohke-h-box > .label{padding: 4px 8px;font-weight: bold;text-align: right;word-break: break-word}
.ohke-h-box > .label.view{padding-top: 2px}
.ohke-h-box.hf-align-left{justify-content: flex-start;}
.ohke-h-box.hf-align-center{justify-content: center;}
.ohke-h-box.hf-align-right{justify-content: flex-end;}
.ohke-h-box.hf-align-justify{justify-content: space-between;}

.ohke-v-box > .label {width: 100%}
.ohke-v-box > .control {width: 100%; padding: 0 !important}
.ohke-h-box > .control {width: 100%}
.ohke-h-box > .label {width: 25%}
.ohke-h-box > .label ~ .control {width: 75% !important;}
.ohke-h-box.medium > .label {width: 50%}
.ohke-h-box.medium > .label ~ .control {width: 50% !important;}
.ohke-h-box.large > .label {width: 75%}
.ohke-h-box.large > .label ~ .control {width: 25% !important;}
/*Horizontal box but left align*/
.ohke-hl-box{display:flex}
.ohke-hl-box > .label{padding: 4px 8px;font-weight: bold;text-align: left;max-width:50%}
.ohke-hl-box > .label.view{padding-top: 2px}
.ohke-hl-box > .control {flex:1;text-align:left}
/*Horizontal box but label left align, control right align*/
.ohke-hj-box{display:flex}
.ohke-hj-box > .label{padding: 4px 8px;font-weight: bold;text-align: left;max-width:50%}
.ohke-hj-box > .label.view{padding-top: 2px}
.ohke-hj-box > .control {flex:1;text-align:right;padding-right:0}


.ohke-f-box > .control > .adv-combo-container,
.ohke-f-box > .control > .adv-combo-container > .adv-combo-subform,
.ohke-f-box > .control > .mc-combo-container,
.ohke-f-box > .control > .mc-combo-container > .mc-combo-subform
{
  height: 100%;
}
.ohke-f-box > .control > .adv-combo-container > .adv-combo-subform > .agent-container,
.ohke-f-box > .control > .mc-combo-container > .mc-combo-subform > .agent-container
{
  height: 100%;
  display: flex;
  flex-direction: column;
}
.ohke-f-box > .control > .adv-combo-container > .adv-combo-subform > .agent-container > .ohke-content,
.ohke-f-box > .control > .mc-combo-container > .mc-combo-subform > .agent-container > .ohke-content,
.ohke-control > file-viewer
{
  flex: 1;
  max-height: unset !important;
}

.fit-height {
  display: flex;
  flex-direction: column;
}

.fit-height > *:last-child {
  flex: 1;
  overflow-y: auto;
}

.fit-cell-content {
  white-space: nowrap;
  width: 1px;
  padding: 8px 4px !important;
}

.fit-cell-small {
  white-space: nowrap;
  width: 1px;
}

.modal-container .w3-modal {
  z-index: 1000;
}

.w3-modal-content > .ohke-content {
  max-height: calc(100vh - 2*var(--modal-padding));
  overflow: auto;
}

.w3-modal-content > .ohke-header ~ .ohke-content {
  max-height: calc(100vh - var(--header-height) - 2*var(--modal-padding));
  /*background: #fff;*/
  border-radius: 0 0 6px 6px;
}

.form-modal > .w3-modal-content > header > .action {
  padding-top: 5px;
}

.form-modal > .w3-modal-content {
  max-width: calc(100% - 20px);
  width: 100%;
  margin: auto
}

.form-modal.modal-small > .w3-modal-content {
  width: 300px;
}

.form-modal.modal-medium > .w3-modal-content {
  width: 600px;
}

.form-modal.modal-large > .w3-modal-content {
  width: 900px;
}

.w3-modal {
  padding: var(--modal-padding) 0;
}

.w3-modal.ohke-top-modal {
  --modal-padding: 10px;
}

.ohke-control {
  padding: 4px 8px;
}

.ohke-control label, .ohke-content fieldset > legend {
  font-weight: bold;
}
.ohke-content fieldset {
  border-radius: 6px;
}
.ohke-content fieldset > legend {
  margin-left: 8px;
}
.ohke-control label.one-line {
  padding: 4px 8px;
}

/*.agent-list input.w3-input {
  height: 22px !important;
  padding: 2px 8px;
}*/

.border-invisible {
  border-color: transparent !important;
}

.ohke-box {
  border-bottom: 1px solid var(--border-color);
  border-radius: 6px;
  padding: 2px 12px;
  min-height: 25px;
  font-size: 11px;
  word-break: break-word;
  position: relative;
}
.ohke-box.number,.ohke-box.text{
  font-size: inherit;
}
.ohke-box.has-history{
  padding-right: 36px;
}

.ohke-box img {
  max-width: 100%;
}

.ohke-box > .fa-btn {
  position: absolute;
  right: 11px; /*equal ohke-box padding-right*/
  top: 2px; /*equal ohke-box padding-top*/
  padding: 4px;
  cursor: pointer;
  border-radius: 50%;
  color: var(--main-color);
  text-decoration: none;
}

@keyframes kf-list-empty {
  0% {
    background-position: right 10px top 10px;
  }
  50% {
    background-position: right 10px top 2px;
  }
  100% {
    background-position: right 10px top 10px;
  }
}

.list-empty {
  font-size: 11px;
  text-align: center;
  min-height: 110px;
  padding-top: 40px;
  /*background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='459px' height='459px' viewBox='0 0 459 459' xml:space='preserve'%3E%3Cdefs%3E%3ClinearGradient id='grad' x1='0%25' y1='0%25' x2='100%25' y2='0%25'%3E%3Cstop offset='0%25' style='stop-color:%232196F3;stop-opacity:1' /%3E%3Cstop offset='100%25' style='stop-color:%232196F3;stop-opacity:0' /%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%3E%3Cpath d='M178.5,140.25v-102L0,216.75l178.5,178.5V290.7c127.5,0,216.75,40.8,280.5,130.05C433.5,293.25,357,165.75,178.5,140.25z' transform='rotate(90 230 230)' fill='url(%23grad)'/%3E%3C/g%3E%3C/svg%3E%0A");*/
  /*background-repeat: no-repeat;*/
  /*background-position: right 10px top 10px;*/
  /*background-size: 100px 100px;*/
  animation: kf-list-empty 1s linear infinite;
}

.list-empty-no-new {
  font-size: 11px;
  text-align: center;
  min-height: 110px;
  padding-top: 40px;
}

@keyframes kf-list-not-found {
  0% {
    background-position: left 50px top 10px;
  }
  50% {
    background-position: left 50px top 2px;
  }
  100% {
    background-position: left 50px top 10px;
  }
}

.list-not-found {
  font-size: 11px;
  text-align: center;
  min-height: 110px;
  padding-top: 40px;
  /*background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='459px' height='459px' viewBox='0 0 459 459' xml:space='preserve'%3E%3Cdefs%3E%3ClinearGradient id='grad' x1='0%25' y1='0%25' x2='100%25' y2='0%25'%3E%3Cstop offset='0%25' style='stop-color:%232196F3;stop-opacity:1' /%3E%3Cstop offset='100%25' style='stop-color:%232196F3;stop-opacity:0' /%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%3E%3Cpath d='M178.5,140.25v-102L0,216.75l178.5,178.5V290.7c127.5,0,216.75,40.8,280.5,130.05C433.5,293.25,357,165.75,178.5,140.25z' transform='matrix(1 0 0 -1 0 459) rotate(270 230 230)' fill='url(%23grad)'/%3E%3C/g%3E%3C/svg%3E%0A");*/
  /*background-repeat: no-repeat;*/
  /*background-position: left 50px top 10px;*/
  /*background-size: 100px 100px;*/
  animation: kf-list-not-found 1s linear infinite;
}

.no-padding {
  padding: 0;
}
.no-padding > .label,.no-padding > .control,.no-padding > .control > .ohke-box{
  padding: 0;
}
.no-padding > .label ~ .control{
  padding-left: 12px;
}

.w3-small {
  font-size: 11px !important;
}

.inline-form .selected {
  background-image: linear-gradient(to bottom, #fff 0%, #6eb9f7 50%, #fff 100%);
}

.app-type-subform {
  background-image: linear-gradient(to bottom, #fff 0%, #d0ce95 50%, #fff 100%);
}

.app-type-inlineform {
  background-image: linear-gradient(to bottom, #fff 0%, #b9dbba 50%, #fff 100%);
}

.scrollable {
  overflow: auto;
}

.w3-dropdown-content {
  z-index: 900;
}

.virtual-btn {
  color: seagreen;
  cursor: pointer;
}

.mcombo-item {
  border-radius: 6px;
  margin: 0 3px 3px 0;
  display: inline-block;
  padding: 0 4px;
  border: 1px solid #ccc;
  background: white;
  background: linear-gradient(0, #ccc, white, #ccc);
}

.ohke-required .w3-input, .ohke-required .o-radio, .ohke-required .chosen-container .chosen-choices, .ohke-required .chosen-container .chosen-single, .ohke-required .ohke-group > *.w3-border:first-child, .ohke-required .ohke-group > *.ohke-box:first-child, .ohke-required .number-group-input .minus-btn {
  border-left: 3px solid var(--red) !important;
}
.ohke-required .number-group-input .w3-input{
  border-left: none !important;
}

.ohke-popup {
  border-radius: 6px;
}

.ohke-popup-header .close-btn {
  float: right;
  padding: 10px;
  color: unset;
  margin-top: 5px;
}

.ohke-popup-header {
  border-radius: 6px 6px 0 0;
  padding: 1px 10px;
}

.ohke-popup-footer {
  border-radius: 0 0 6px 6px;
  text-align: center;
  padding: 20px 16px;
}

.ohke-popup-footer .ohke-btn {
  line-height: 18px;
  min-width: 50px;
  margin: 15px;
}

.ohke-popup-icon {
  float: left;
  font-size: 24px !important;
  margin: 13px 10px 0 10px;
}

.ohke-popup-body {
  padding: 0.01em 16px;
  font-size: 13px !important;
  margin: 16px 0;
}

.ohke-parent-loading {
  position: relative !important;
}

.ohke-content-loading .fa {
  margin-right: 5px;
}

.ohke-content-loading {
  color: #fff;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 22px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 5px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 461;
  user-select: none;
}

.wizard-nav {
  margin: 0;
  padding: 4px 0 0;
  display: inline-block;
  height: 20px;
  overflow: hidden;
}

.wizard-nav > li:first-child {
  border-radius: 6px 0 0 6px
}

.wizard-nav > li:first-child:before {
  display: none
}

.wizard-nav > li:last-child {
}

.wizard-nav > li.done:before {

}

.wizard-nav > li:before {
  content: "\f105";
  font: normal normal normal 14px/1 FontAwesome;
  color: var(--white);
}

.wizard-nav > li.done {
  color: #b8c7ce;
}

.wizard-nav > li.active {
  font-weight: bold;
  color: red;
}

.wizard-nav > li {
  color: var(--white);
  padding: 0;
  display: inline-block;
  width: auto;
  user-select: none;
  vertical-align: middle;
  overflow: hidden;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
}

.col-visible:after {
  content: '';
  display: inline-block;
}

#ohke_popup_instance,.ohke_popup_instance {
  z-index: 9999;
}

.w16 {
  width: 16px
}

.w24 {
  width: 24px
}

.w32 {
  width: 32px
}

.w64 {
  width: 64px
}

.w100 {
  width: 100px
}

.w150 {
  width: 150px
}

.w200 {
  width: 200px
}

.h64 {
  height: 64px
}

.h150 {
  height: 150px
}

.avatar-container {
  position: relative;
  display: inline-block;
}

.avatar-container:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.avatar-container img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 50%;
  min-height: unset !important;
  max-height: unset !important;
  min-width: unset !important;
  max-width: unset !important;
}

.avatar-container span {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1px solid var(--lighter-color);
  background: var(--white);
}
.ohke-file-viewer {
  padding: 0 !important;
}

.ohke-file-viewer .w3-modal-content {
  width: 100%;
  height: 100%;
}

.ohke-file-viewer .ohke-content {
  padding: 0;
  max-height: unset !important;
}

.ohke-btn-group {
  display: inline-flex
}

.ohke-btn-group .ohke-btn {
  border-radius: 0;
  margin: 0 !important;
  border-left: 1px dotted #a9cbef;
}

.ohke-btn-group .ohke-btn:last-child {
  border-top-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
}

.ohke-btn-group .ohke-btn:first-child {
  border-top-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
  border: 0;
}

.w3-round {
  border-radius: 6px !important;
}

.ohke-light-trans .ohke-btn {
  background: var(--light-trans-color);
  color: black;
}

.ohke-percent-bar {
  border-radius: 8px;
  overflow: hidden;
}

.ohke-percent-bar div {
  height: 18px;
  justify-content: center;
  align-items: center;
  display: flex;
  overflow: hidden;
  white-space: nowrap;
}
.ohke-debug-block {
  position: relative;
  margin-bottom: 10px;
  border: 1px solid #ccc;
}
.ohke-debug-block .code {
  white-space: pre-wrap;
  text-align: left;
  word-break: break-all;
  background: white;
  color: black;
  max-height: 200px;
  overflow: auto;
  padding: 6px;
}
.ohke-debug-block .copy div {
  color: var(--light-color);
  padding: 4px;
}
.ohke-debug-block .copy {
  position: absolute;
  right: 12px;
  top: 6px
}
.w3-modal-content .patch-end {height: 0}
.ohke-form-icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin-top: -4px;
}
.ohke-header.list-mode > .filter-form > .title {
  margin-right: 8px;
}
.ohke-header.list-mode > .filter-form > .search {
  flex: 1;
}
.ohke-header.list-mode > .filter-form {
  display: flex;
}
.ohke-status-container .label {
  flex: 1;
  height: 27px;
  white-space: nowrap;
}
.ohke-status-container .transition {
  margin-top: -6px;
  display: flex;
  flex-wrap: wrap;
}
.ohke-status-container .transition-btn {
  margin-left: 6px;
}
.ohke-status-container {
  display: flex;
}
.ohke-status {
  display: inline-block;
  border-radius: 6px;
  padding: 4px 12px;
  margin: -4px 0;
}
.ohke-inline{
  display: inline-block;
}
.no-min-height{
  min-height: unset !important;
}
.top-bar img.people {
  border-radius: 50%;
  width: 32px;
  height: 32px;
}
.query-filter-row{
  display: flex;cursor: pointer;user-select: none;
  margin: 6px 0;
  font-size: 12px;
}
.query-filter-row > div:last-child{
  margin-left: 8px
}
.query-filter-row .star{
  color: #f2ba29;font-size:15px;
  line-height: 18px;
}
.query-select-one-horizontal.agent-list {
  font-size:12px;
  color:#444;
  user-select: none;
  cursor: pointer;
  padding: 6px;
}
.query-select-one-horizontal .list-item {
  padding: 4px 6px;
  display:flex;
}
.query-select-one-horizontal .list-item > div:last-child{
  margin-left: 6px;
  flex:1
}
.icon-inside-input {
  height: 0;
  padding-left: 6px;
}
.ohke-box .icon-inside-input {
  display: inline-block;
  padding: 0;
}
.icon-inside-input img {
  height: 20px;
  width: 20px;
}
.icon-inside-input ~ .w3-input {
  padding-left: 32px;
}
.ohke-popup-subform{
  background: var(--background-color);
  position: absolute;
  z-index: 1000;
  max-height: calc(100vh - 16px);
  max-width: calc(100vw - 32px);
  overflow: hidden auto;
  animation:animatezoom 0.6s;
}
.ohke-video-container .video-display{
  min-height:50px;
  width:100%;
}
.ohke-video-container .video-display > video, .ohke-video-container .video-display > iframe{
  max-width: 100%;
}
.help-text{
  font-style: italic;
  font-size: .8em;
}
.ohke-oia{
  background: none;
}
.ohke-oia img{
  height: 18px;
}
.ohke-oia-link {
  text-decoration: none;
}
.ohke-oia-link:hover {
  text-decoration: underline !important;
}
.ohke-inline-input {
  position: relative;
}
.ohke-inline-saved.right{
  right: 12px;
}
.ohke-inline-saved.left{
  left: 12px;
}
.ohke-inline-saved{
  position: absolute;
  color: var(--main-color);
  font-size: 12px;
  opacity: 0;
  top: 5px
}
.ohke-inline-saved.animate { animation: ohke-inline-disappear 2s linear; }

@keyframes ohke-inline-disappear {
  10%  { opacity: 1; }
  60%  { opacity: 1; }
  100% { opacity: 0; }
}
/*input_type=radio*/
.o-col-1{
  grid-template-columns: 1fr;
}
.o-col-2{
  grid-template-columns: 1fr 1fr;
}
.o-col-3{
  grid-template-columns: 1fr 1fr 1fr;
}
.o-col-4{
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.o-col-n label{
  grid-row: 1;
}
.o-radio {
  display: grid;
  gap: 6px;
  padding: 0 6px;
}
.o-radio input{
  margin-right: 6px;
}
.o-radio label{
  display: flex;
  border-radius: 4px;
  min-height: 27px;
  align-items: center;
  line-height: 1;
  font-weight: normal;
}
.o-radio label:hover{
  box-shadow: 0px 0px 4px var(--hover-color);
}
span.ohke-object-class{
  border-radius: 6px;
  margin: 0 3px 3px 0;
  display: inline-block;
  padding: 0 4px;
  border: 1px solid #ccc;
  background: white;
  background: linear-gradient(0, #ccc, white, #ccc);
}
.top-bar .w3-bar-item.toggle-form-debug{
  padding-top: 16px !important;
}
#debug-panel{
  position: absolute;
  z-index: 99999;
  height: 48px;
  left: 10px;
  right: 10px;
  bottom: 10px;
  background: var(--dark-color);
  font: 12pt "Courier New", Serif;
  font-weight: bold !important;
  color: var(--active-color);
}
#debug-panel a{
  text-decoration: none;
}
#debug-panel .ag-info {
  display: inline-block;
  border-radius: 8px;
  background: var(--light-color);
  padding: 4px;
  margin: 2px;
}
#debug-panel .ag-action {
  text-align: center;
}
.barcode{margin: 0 auto;}
.barcode .barcode-label{display: flex;flex-wrap: nowrap;justify-content: center;}
.barcode svg{display:block}
.print-table{
  border-collapse:collapse;
  border:1px solid gray;
  table-layout: fixed;
  word-break: break-word;
}
.print-table th,.print-table td{
  border:1px solid gray;
  padding: 2px 4px;
  line-height: 1;
}
.g-print {
  font: 12pt "Times New Roman", serif;
}

@media screen{
  .g-print .page-outside {
    margin: 10px auto;
    border: 1px solid gray;
    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.75);
  }
}
@media print{
  .g-print .page-outside {
    margin: 0;
    border: none;
    box-shadow: unset;
  }
}

.g-print .label {
  width: unset !important;
  padding-left: 0 !important
}

.g-print .ohke-control {
  padding: 0
}

.g-print .control {
  flex: 1;
  border-radius: 0;
  border-bottom: 2px dotted var(--border-color);
  padding: 8px 8px 0;
  line-height: 0.7;
  font-size: unset;
}

.g-print .ohke-v-box .control {
  padding: 0
}

.g-print p {
  margin: 0
}

.g-print .o-radio {
  margin-top: -8px;
}

.g-print .o-radio img {
  width: 18px;
  margin-right: 4px;
}
.page-master .page-outside{
  page-break-after: avoid !important;
  width: unset !important;
  min-height: unset !important;
  padding-top: 0 !important;
  margin: 0 !important;
  border: none !important;
  box-shadow: none !important;
}
.page-master .page-outside > .page-inside{
  margin: 0 !important;
}
.g-print .page-outside {
  width: 210mm;
  min-height: 297mm;
  padding-top: 0.001cm; /*Fix headless bug*/
  page-break-after: always;
  overflow: hidden;
}
.g-print .page-inside {
  margin: 15mm;
}
.ohke-environment{
  padding: 3px 6px;
  text-transform: uppercase;
  background: var(--light-color);
  color: var(--white);
  border-radius: 6px;
  display: none;
}
.main-sidebar .ohke-environment{
  text-align: center;
  border-radius: 0
}
@media (max-width:600px){.ohke-environment{display:none}}
.see-more-hidden{display:none}
.see-more-btn{
  color: var(--light-color);
  cursor: pointer;
  text-decoration: none;
  font-size: 11px; /*identified as body class in ohke.css*/
  font-family: Verdana, sans-serif; /*identified as body class in w3.css*/
  line-height: 1.5; /*identified as body class in w3.css*/
  font-style: normal;
  font-weight: normal;
}
.see-more-btn:hover{
  color: var(--lighter-color);
}
.site-avatar div{
  position: relative;
  padding-bottom: 100%;
  min-width: 16px;
}
.site-avatar img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.site-avatar img.square, .site-avatar-transform-square{
  border-radius: 6px;
}
.site-avatar img.circle, .site-avatar-transform-circle{
  border-radius: 50%;
}
.site-avatar-transform-fit{
  max-height: unset !important;
  max-width: unset !important;
  width: 100%;
  height: 100%;
}
.ws-avatar.inline {
  display: inline-block;
}

.ws-avatar .ws-inner {
  display: flex;
  align-items: center;
}

.ws-avatar .id {
  white-space: nowrap;
}

.ws-avatar .id.out {
  padding-left: 8px;
}

.ws-avatar .name {
  padding-left: 8px;
  flex: 1
}

.ws-avatar .flex {
  flex: 1
}

.ws-avatar .hide {
  display: none;
}

.ws-avatar .goto {
  padding: 1px 12px;
  margin-left: 8px;
}

.ws-avatar .avatar > div {
  text-align: right
}

.ws-avatar .avatar {
  display: inline-block
}

.ws-avatar a {
  text-decoration: none;
}

.ws-avatar .avatar.circle > div, .ws-avatar .avatar.square > div {
  padding-bottom: 100%;
  position: relative;
}

.ws-avatar .avatar.circle img, .ws-avatar .avatar.square img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ws-avatar .avatar.circle img {
  border-radius: 50%;
}

.ws-avatar .avatar.square img {
  border-radius: 8px;
}
.ohke-formula {
  position: relative;
  border-radius: 6px;
}

.ohke-formula .toolbar {
  text-align: right;
  background: #eee;
  border: 1px solid #ccc;
  border-bottom-width: 0;
  border-radius: 6px 6px 0 0;
  padding: 2px 6px;
  user-select: none;
}

.ohke-formula .btn {
  background: var(--light-color);
  color: var(--white);
  padding: 0 6px;
  display: inline-block;
  border-radius: 6px;
  margin-left: 6px;
  text-align: center;
  cursor: pointer;
}

.ohke-formula .btn:hover {
  background: var(--hover-color);
}

.ohke-formula table {
  width: 100%;
  border-style: solid;
  border-color: #ccc;
  border-width: 0 1px 1px 1px;
}

.ohke-formula table .w3-input {
  padding: 2px 8px;
  border-style: solid;
  border-left: 1px solid #ccc !important;
}

.ohke-formula .ohke-table th, .ohke-formula .ohke-table td {
  padding: 2px 4px;
}

.ohke-formula .result {
  border-radius: 0 0 6px 6px;
  background: #eee;
  border: 1px solid #ccc;
  border-top-width: 0;
  padding: 2px 6px;
}
.ohke-formula .error{
  color:var(--red)
}
.w3-modal.ohke-file-viewer .ohke-content{
	height: 100%;
  overflow: hidden;
}
tr.list-item:hover > td > .floating-item-action, div.list-item:hover > .floating-item-action{
  display: block;
}
.floating-item-action{
  position: absolute;
  width: 32px;
  height: 24px;
  display: none;
  text-align: center;
  right: 42px;
  top: 6px;
  background: var(--light-color);
  padding-top: 4px;
  border-radius: 6px;
  text-decoration: none;
  z-index: 99999;
}
.floating-item-action:hover{
  background: var(--hover-color);
}
.btn-copy-document{
  position: relative;
  overflow: visible;
}
.btn-copy-document div{
  position: absolute;
  right: 0;
  top: 0;
  text-shadow: 0px 0px 4px black;
  color: white;
}
.w3-table-all{
  color: black;
}
/*START CSS for widget applicator*/
.wa-applicator {
  position: relative;
  cursor: pointer;
  border-radius: 6px;
}

.wa-applicator.inline {
  display: inline-block;
}

.wa-applicator .applicator-inner {
  display: flex;
  align-items: center;
  text-decoration: none;
}

.wa-applicator .icon-hot {
  position: absolute;
  top: -6px;
  right: -6px;
}

.wa-applicator .id {
  white-space: nowrap;
}

.wa-applicator .id.out {
  padding-left: 8px;
}

.wa-applicator .name {
  padding-left: 8px;
  flex: 1
}

.wa-applicator .flex {
  flex: 1
}

.wa-applicator .hide {
  display: none !important;
}

.wa-applicator .icon-inner {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  overflow: hidden;
}

.wa-applicator .icon {
  position: relative;
  width: 28px;
  height: 28px;
}

.wa-applicator .ohke-badge {
  margin-left: 6px;
}

.wa-applicator .icon img {
  max-width: 100%;
  max-height: 100%;
}
.wa-applicator:hover{
  box-shadow: 0 0 4px var(--hover-color);
}
.wa-applicator:hover .wa-applicator-popup{
  display: block;
}
.wa-applicator .wa-applicator-popup {
  position: absolute;
  display: none;
  box-shadow: 2px 2px 6px #ccc;
  border-radius: 6px;
  border: 1px solid #ccc;
  overflow: hidden;
  top: -28px;
  right: 0;
}
.wa-applicator .wa-applicator-popup .wa-target{
  text-decoration: none;
  cursor: pointer;
  padding: 4px 8px;
  background: var(--white);
  color: var(--dark-color);
  height: 28px;
  display: inline-block;
  font-size: 13px;
}
.wa-applicator .wa-applicator-popup .wa-target:hover{
  background: var(--hover-color);
}
.wa-applicator .wa-applicator-popup .wa-target .fa {
  color: var(--main-color);
  width: 16px;
}
/*END CSS for widget applicator*/
/*START widget currency*/
.ohke-box.currency{
  font-size: inherit;
}
.currency-group{
  display: flex;
  align-items: center;
  gap: 6px;
}
.currency-group.inline, .ohke-hj-box > .control > .currency-group{
  display: inline-flex;
}
/*END widget currency*/
/*START Pivot*/
.pivot-h-scroll{overflow: auto !important}
.pivot-h-scroll > table{width: max-content !important}
/*END Pivot*/