html,
body {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  background-color: var(--apx-bk-color);
}
a,
.btn-link {
  color: #006bb7;
}
.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}
.content {
  padding-top: 1.1rem;
}
h1:focus {
  outline: none;
}
.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}
.invalid {
  outline: 1px solid #e50000;
}
.invalid-feedback {
  background: #eef;
  border-radius: 0.25em;
  border: solid 1px #333;
  padding: 0.25em !important;
  margin-bottom: 0.5em;
}
.validation-message {
  color: #e50000;
}
.blazor-error-boundary {
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
  padding: 1rem 1rem 1rem 3.7rem;
  color: white;
}
.blazor-error-boundary::after {
  content: "An error has occurred.";
}
.darker-border-checkbox.form-check-input {
  border-color: #929292;
}
.form-floating > .form-control-plaintext::placeholder,
.form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}
.form-floating > .form-control-plaintext:focus::placeholder,
.form-floating > .form-control:focus::placeholder {
  text-align: start;
}
.container-scroller {
  display: flex;
  overflow: hidden;
}
.main-panel {
  transition: width 0.25s ease, margin 0.25s ease;
  width: 100%;
  min-height: 100vh;
  padding-top: var(--header-row-height);
  display: flex;
  flex-direction: column;
}
.page-body-wrapper {
  min-height: calc(100vh - var(--header-row-height));
  display: flex;
  flex-direction: row;
  padding-left: 0;
  padding-right: 0;
  width: calc(100vw - var(--sidebar-width));
  transition: width 0.25s ease, margin 0.25s ease;
}
.navbar {
  font-family: "Rubik", sans-serif;
  left: var(--sidebar-width);
  transition: left 0.25s ease, width 0.25s ease;
  padding: 0;
}
@media (max-width: 991px) {
  .navbar {
    left: 0;
    height: var(--header-row-height);
    flex-direction: row;
  }
}
.navbar .navbar-menu-wrapper {
  background-color: var(--apx-bk-color);
  color: var(--apx-fg-color);
  padding: 0px 15px;
  width: calc(100vw - var(--sidebar-width));
  height: var(--header-row-height);
  transition: width 0.25s ease;
  border-left: solid 1px #336;
}
@media (max-width: 991px) {
  .navbar .navbar-menu-wrapper {
    width: 100vw;
    padding-left: 11px;
  }
}
.navbar-toggler {
  padding: 0.25rem 0.75rem;
  font-size: 1rem;
  line-height: 1;
  color: #fff;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  outline: 0;
  outline-offset: 0;
}
.navbar .navbar-menu-wrapper .navbar-toggler {
  border: 0;
  color: #8e94a9;
}
.navbar .navbar-menu-wrapper .navbar-toggler i:before {
  width: 34px;
  height: 34px;
  display: block;
  border-radius: 50px;
  background: #3f3f40;
  text-align: center;
  line-height: 2.2;
}
.navbar .navbar-menu-wrapper .navbar-toggler-right i:before {
  background-color: transparent;
}
@media screen and (max-width: 991px) {
  .page-body-wrapper {
    width: 100%;
  }
}
@media (min-width: 992px) {
  .sidebar-fixed .page-body-wrapper {
    width: 100%;
    margin-left: 260px;
  }
}
.content-wrapper {
  background: var(--apx-bk-color-medium);
  padding: 0em;
  flex-grow: 1;
  color: #fff;
}
.page-header {
  display: flex;
  flex-direction: row;
  flex-grow: 1;
  z-index: 10;
  background: var(--apx-bk-color-dark);
  color: var(--apx-fg-color-dark);
  border-bottom: solid 1px #888;
  width: calc(100vw - var(--sidebar-width));
  padding: 1.25em;
  margin-left: 0;
  height: var(--header-row-height);
  transition: width 0.25s ease;
}
.page-header .btn-page-back {
  color: white;
}
.page-header .btn-page-back:hover {
  color: var(--apx-fg-color-light);
  border: solid 1px black;
  background: var(--apx-bk-color-light);
}
.page-header .page-title {
  font-weight: bold;
  font-size: 110%;
  flex-grow: 1;
}
.page-header .page-controls {
  display: flex;
  align-items: center;
  flex-direction: row;
}
.sidebar-icon-only .page-header {
  width: calc(100% - 70px);
  transition: all 0.25s ease;
}
.page-wrapper {
  display: flex;
  flex-direction: column;
}
.page-wrapper .page-body {
  display: flex;
  flex-direction: column;
  padding-top: var(--header-row-height);
}
.page-wrapper .page-body .page-nav {
  flex-grow: 1;
}
.page-wrapper .page-body .page-detail {
  flex-grow: 1;
}
.sidebar {
  min-height: 100vh;
  background: var(--apx-bk-color);
  padding: 0;
  width: var(--sidebar-width);
  z-index: 11;
  transition: width 0.25s ease, background 0.25s ease;
}
@media (min-width: 992px) {
  .sidebar-fixed .page-body-wrapper {
    width: 100%;
    margin-left: var(--sidebar-width);
  }
  .sidebar-fixed .sidebar {
    position: fixed;
    max-height: auto;
  }
  .sidebar-icon-only .page-body-wrapper {
    width: calc(100% - 70px);
    margin-left: 70px;
  }
  .sidebar-icon-only .navbar {
    left: 70px;
  }
  .sidebar-icon-only .navbar .navbar-menu-wrapper {
    width: calc(100% - 70px);
  }
  .sidebar-icon-only .sidebar .sidebar-brand-wrapper .brand-logo-mini {
    display: inline-block;
  }
  .sidebar-icon-only .sidebar .sidebar-brand-wrapper .brand-logo {
    display: none;
  }
  .sidebar-icon-only .sidebar:not(:hover) {
    width: 70px;
  }
  .sidebar-icon-only .sidebar:not(:hover) .nav .nav-item .collapse {
    display: none;
  }
  .sidebar-icon-only .sidebar:not(:hover) .menu-title {
    display: none;
  }
}
.nav-scrollable {
  xdisplay: none;
  scrollbar-width: thin;
  scrollbar-gutter: stable;
  scrollbar-color: #ccc #225;
}
@media (min-width: 641px) {
  .nav-scrollable {
    overflow-y: auto;
  }
}
@media screen and (max-width: 991px) {
  .page-body-wrapper {
    width: 100%;
  }
  .page-header {
    width: calc(100vw);
  }
  .sidebar-offcanvas {
    position: fixed;
    max-height: calc(100vh - 70px);
    top: 70px;
    bottom: 0;
    overflow: auto;
    right: -260px;
    -webkit-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out;
  }
  .sidebar-offcanvas.active {
    right: 0;
  }
}
.page-body .card {
  background-color: var(--apx-card-back-color);
  color: var(--apx-card-color);
  border: var(--apx-card-border);
  font-size: var(--apx-font-size);
  margin-bottom: 1em;
}
.page-body .card .card-header {
  background-color: var(--apx-table-header-back-color);
  color: var(--apx-table-header-color);
}
.nav-tonic {
  font-size: var(--apx-font-size);
  line-height: calc(var(--apx-font-size) * 1.5);
  user-select: none;
}
.nav-tonic .menu-break {
  margin: 0.2em;
  border: 0;
  height: 1px;
}
.nav-tonic .nav-link {
  display: block;
  cursor: pointer;
  color: var(--apx-fg-color-dark);
  background-color: var(--apx-bk-color-dark);
  margin: 2px 4px;
  border-radius: 4px;
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: var(--apx-font-size);
  line-height: calc(var(--apx-font-size) * 1.5);
}
.nav-tonic .nav-link:hover {
  color: var(--apx-fg-color-light);
  background-color: var(--apx-bk-color-light);
}
.nav-tonic .nav-link .menu-icon {
  width: 2em;
}
.nav-tonic .nav-link .menu-title {
  flex-grow: 1;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nav-tonic .nav-link .menu-chevron {
  font-size: 60%;
}
.nav-tonic .dropdown-menu {
  position: relative;
  background-color: var(--apx-bk-color-medium);
  width: calc(var(--sidebar-width) - 1.5em);
  border: none;
  padding: 0.1em;
  margin: 0em 0.25em 0em 0.5em;
}
.nav-tonic .dropdown-menu .nav-link {
  color: var(--apx-fg-color-dark);
  background-color: var(--apx-bk-color-dark);
  margin: 2px 4px;
  width: calc(var(--sidebar-width) - 2.5em);
}
.nav-tonic .dropdown-menu .nav-link:hover {
  color: var(--apx-fg-color-light);
  background-color: var(--apx-bk-color-light);
}
.top-row {
  min-height: var(--top-row-height);
  background-color: var(--apx-bk-color);
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-row a {
  color: var(--apx-fg-color);
  text-decoration: none;
}
.navbar-brand {
  font-size: 1.1rem;
}
.modal .modal-content {
  background: var(--apx-card-back-color);
  color: var(--apx-card-color);
}
.modal .modal-content a {
  background: var(--apx-card-back-color);
  color: var(--apx-card-color);
}
.modal .modal-content a:hover {
  color: #fff;
}
.modal .modal-content .modal-header {
  background: var(--apx-bk-color);
  color: var(--apx-fg-color);
}
.table {
  background-color: var(--apx-bk-color-light);
  color: var(--apx-fg-color-dark);
  border: var(--apx-border-dark);
  font-size: var(--apx-font-size);
  background-color: var(--apx-table-header-back-color);
  border-color: var(--apx-table-header-color);
  border-width: 4px;
  color: var(--apx-table-row-color);
  border-radius: 0.5em;
  overflow: hidden;
}
.table.table-fixed {
  table-layout: fixed;
}
.table button {
  font-size: var(--apx-font-size);
  padding: 0.25em 0.5em;
  color: #fff;
}
.table.table-has-controls-2 tr td:last-child {
  width: Calc(6em);
}
.table tr {
  border-color: var(--apx-table-header-back-color);
  border-bottom-width: 4px;
}
.table td,
.table th {
  padding: 0.25rem;
  vertical-align: middle;
}
.table td a,
.table th a {
  color: var(--apx-table-row-color);
}
.table thead tr {
  background-color: var(--apx-table-header-back-color);
  color: var(--apx-table-header-color);
}
.table tbody tr {
  background-color: var(--apx-table-header-back-color);
  color: var(--apx-table-header-color);
}
.table tbody tr:hover {
  background-color: var(--apx-table-row-accent-back-color);
  color: var(--apx-table-row-accent-color);
}
.table tbody tr td .btn-command {
  margin: 0 0.35em;
  padding: 0.15em 0.3em;
}
.table.table-striped > tbody > tr > td {
  background-color: var(--apx-table-row-back-color);
  color: var(--apx-table-row-color);
}
.table.table-striped > tbody > tr:nth-of-type(odd) > td {
  background-color: var(--apx-table-row-stripe-back-color);
  color: var(--apx-table-row-stripe-color);
}
.progress-with-steps {
  font-size: 10px;
}
.progress-with-steps .progress-steps {
  position: relative;
  display: flex !important;
  margin: 0 1em;
}
.progress-with-steps .progress-steps .progress-bar {
  margin: 0.8em 0;
  background-color: #6c757d !important;
}
.progress-with-steps .progress-steps .progress-bar.complete {
  background-color: #28a745 !important;
}
.progress-with-steps .progress-steps .progress-bar.active {
  background-color: #007bff !important;
}
.progress-with-steps .progress-steps .progress-step {
  background: #88f;
  color: #fff;
  border-radius: 50%;
  font-size: 110%;
  text-align: center;
  vertical-align: middle;
  width: 2em;
  height: 2em;
  margin-left: -1em;
  margin-right: -1em;
  border: solid 2px #fff;
  z-index: 10;
  box-shadow: 1px 1px 4px 4px rgba(0, 0, 0, 0.2);
  background-color: #6c757d !important;
}
.progress-with-steps .progress-steps .progress-step.complete {
  background-color: #28a745 !important;
}
.progress-with-steps .progress-steps .progress-step.active {
  background-color: #007bff !important;
}
.progress-with-steps .progress-step-titles {
  display: flex !important;
}
.progress-with-steps .progress-step-titles .progress-step-title {
  flex-basis: 0;
  flex-grow: 1;
  min-width: 0;
  max-width: 100%;
  text-align: center;
  padding: 0em 2em;
}
.progress-with-steps .progress-step-titles .progress-step-title.complete {
  color: #28a745 !important;
}
.progress-with-steps .progress-step-titles .progress-step-title.active {
  color: #007bff !important;
}
.pagination .page-item {
  user-select: none;
  cursor: pointer;
}
.pagination .page-item:hover .page-link {
  background-color: rgba(60, 60, 60, 0.85);
  color: #fff;
}
.pagination .page-item.disabled {
  cursor: auto !important;
}
.pagination .page-item.disabled .page-link {
  background-color: rgba(250, 250, 250, 0.8);
  color: #aaa;
}
.pagination .page-item.active .page-link {
  background-color: rgba(160, 160, 188, 0.9);
  color: #eee;
}
.editorWrapper {
  display: flex;
  position: relative;
  max-width: calc(100vw - 260px) !important;
}
.CodeMirror {
  width: 100%;
  max-height: 100%;
  padding: 0.375rem 0.75rem;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  font-size: 80%;
}
.images-list {
  align-items: center !important;
  flex-wrap: wrap;
}
.images-list li {
  width: calc(70px);
  border: solid 5px white;
  cursor: pointer;
  margin-right: 1em;
  margin-bottom: 1em;
  display: flex;
  flex-direction: column;
  flex-grow: 0;
  align-self: stretch !important;
  justify-content: space-around;
  text-align: center;
}
.images-list li:hover {
  border: solid 5px #666;
}
.images-list li.selected {
  border: solid 5px #007bff;
}
.images-list li.dropzone {
  display: none;
}
.images-list li.is-drag-item {
  display: none;
}
.images-list.is-dragging li.dropzone {
  display: flex;
  opacity: 1;
  background-color: #ddd;
  align-self: stretch !important;
}
.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}
.invalid {
  outline: 1px solid red;
}
.validation-message {
  color: red;
}
.allowDragDrop {
  user-select: none;
}