@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
@import url("https://fonts.googleapis.com/css?family=Dosis:100,200,500,600,700,900");
@import url("https://fonts.googleapis.com/css?family=Georama:100,200,500,600,700.900");
.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .color-picker-container-drop, .command-bar-drop-items, .message-box-container .modal-content:focus, .message-box-container .modal-content:active, .message-box-container .modal-content, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .sidepanel:focus, .sidepanel:active, .sidepanel, .layout-container-left:focus, .layout-container-left:active, .layout-container-left {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .sidepanel-header-title, .message-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .color-picker-container-drop, .command-bar-drop-items, .message-box-container .modal-content:focus, .message-box-container .modal-content:active, .message-box-container .modal-content, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .sidepanel:focus, .sidepanel:active, .sidepanel, .layout-container-left:focus, .layout-container-left:active, .layout-container-left {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .sidepanel-header-title, .message-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.datalist {
  cursor: default !important;
  border-bottom: 1px solid #ced4da;
  margin-bottom: 0;
}
.datalist > thead > tr {
  background-color: #f8f9fa;
}
.datalist > tbody > tr > td {
  height: 40px;
  vertical-align: middle;
}
.datalist > tbody > tr > td.datalist-menu-cell .dropdown-toggle > i {
  opacity: 0;
}
.datalist > tbody > tr:hover > td.datalist-menu-cell .dropdown-toggle > i {
  opacity: 1;
}
.datalist-menu-cell {
  width: 40px;
  height: 40px;
  padding: 0 !important;
}
.datalist-menu-cell div.dropdown-toggle {
  cursor: pointer;
  height: 40px;
  padding-top: 0.5rem;
  text-align: center;
  font-size: 0.9rem;
  color: #495057;
}
.datalist-menu-cell div.dropdown-toggle:hover {
  background-color: #dee2e6;
}
.datalist-menu-cell .dropdown-menu {
  padding: 0;
}
.datalist-menu-cell .dropdown-menu .dropdown-item {
  font-size: 0.9rem;
  text-transform: uppercase;
  border-width: 0 !important;
  padding: 0.3rem 0.8rem;
  color: #495057;
}
.datalist-menu-cell .dropdown-menu .dropdown-item.primary > i {
  color: #8fd4ff !important;
}
.datalist-menu-cell .dropdown-menu .dropdown-item.secondary > i {
  color: #adb5bd !important;
}
.datalist-menu-cell .dropdown-menu .dropdown-item.success > i {
  color: #28a745 !important;
}
.datalist-menu-cell .dropdown-menu .dropdown-item.info > i {
  color: #17a2b8 !important;
}
.datalist-menu-cell .dropdown-menu .dropdown-item.warning > i {
  color: #f39e2c !important;
}
.datalist-menu-cell .dropdown-menu .dropdown-item.danger > i {
  color: #dd3c4d !important;
}
.datalist-menu-cell .dropdown-menu .dropdown-item.light > i {
  color: #f4f2f2 !important;
}
.datalist-menu-cell .dropdown-menu .dropdown-item.dark > i {
  color: #343a40 !important;
}
.datalist-menu-cell .dropdown-menu .dropdown-item:hover {
  background-color: #e9ecef;
  color: #343a40;
}
.datalist-label {
  font-size: 0.8rem;
  color: #adb5bd;
  text-transform: uppercase;
}
@media screen and (max-width: 768px) {
  .datalist-label {
    font-size: 0.7rem;
  }
}
.datalist-title {
  font-size: 0.9rem;
  color: #6c757d;
  font-weight: 600;
  text-transform: uppercase;
  padding-left: 0 0.2rem;
}
.datalist-title.high {
  font-size: 1rem;
  color: #333333;
}
@media screen and (max-width: 768px) {
  .datalist-title {
    font-size: 0.8rem;
  }
}
.datalist-value {
  font-size: 0.9rem;
  color: #343a40;
  font-weight: unset;
}
.datalist-value-container {
  padding-left: 0 0.2rem;
}
.datalist-value-container.link {
  cursor: pointer;
  color: #8fd4ff;
  text-decoration: none;
}
.datalist-value-container.link:hover {
  text-decoration: underline;
}
.datalist-value-container.no-wrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media screen and (max-width: 768px) {
  .datalist-value {
    font-size: 0.8rem;
  }
}
.datalist-sign {
  font-size: 0.8rem;
  color: #adb5bd !important;
  text-decoration: none !important;
}
.datalist a.datalink {
  font-size: 0.9rem;
  color: #8fd4ff;
  text-decoration: none !important;
}
@media screen and (max-width: 768px) {
  .datalist a.datalink {
    font-size: 0.8rem;
  }
}
.datalist a.datalink.upper {
  text-transform: uppercase;
}
.datalist a.datalink > span {
  text-decoration: none !important;
}

.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .color-picker-container-drop, .command-bar-drop-items, .message-box-container .modal-content:focus, .message-box-container .modal-content:active, .message-box-container .modal-content, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .sidepanel:focus, .sidepanel:active, .sidepanel, .layout-container-left:focus, .layout-container-left:active, .layout-container-left {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .sidepanel-header-title, .message-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.sidenav {
  background-color: #343a40;
  user-select: none;
}
.sidenav-toggle {
  display: none;
}
.sidenav a:hover {
  text-decoration: none !important;
}
.sidenav-top {
  text-align: center;
  padding: 1.5rem 0;
  border-bottom: solid 1px #495057;
}
.sidenav-top > img {
  height: 24px;
  align-self: center;
}
.sidenav-top-text {
  font-size: 0.8em;
  text-transform: uppercase;
  color: #6c757d;
}
.sidenav-commands {
  height: 3.6rem;
  display: flex;
  flex-direction: row;
  border-bottom: solid 1px #495057;
}
.sidenav-commands > div {
  text-align: center;
  flex-grow: 1;
  align-self: center;
}
.sidenav-commands > div > a {
  width: 2.6rem;
}
.sidenav div.item {
  cursor: pointer;
  margin: 0;
  padding: 0;
  width: 100%;
  position: relative;
}
.sidenav div.item > a {
  display: block;
  padding: 0.6rem 0.3rem;
  border-bottom: solid 1px #495057;
  font-size: 1.1rem;
  color: #ced4da;
  text-transform: uppercase;
}
.sidenav div.item > a.active {
  color: #8fd4ff;
}
.sidenav div.item > i {
  position: absolute;
  right: 0.5rem;
  top: 0.7rem;
  color: #8fd4ff;
}
.sidenav div.sub a {
  padding: 0.6rem 2.3rem;
}
.sidenav div.item.menu.active > i {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.sidenav div.item.separator {
  border-bottom: solid 1px #8fd4ff;
}
.sidenav div.item:hover {
  background-color: #495057;
}

@media (max-width: 991.98px) {
  .sidenav-commands {
    display: none;
  }
  .sidenav-menu {
    display: none;
  }
  .sidenav.show > .sidenav-commands {
    display: flex;
  }
  .sidenav.show > .sidenav-menu {
    display: block;
  }
  .sidenav-top {
    padding: 0.5rem 0;
  }
  .sidenav-top-text {
    display: none;
  }
  .sidenav-toggle {
    display: block;
    position: absolute;
    left: 1rem;
    top: 0.4rem;
  }
}
.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .color-picker-container-drop, .command-bar-drop-items, .message-box-container .modal-content:focus, .message-box-container .modal-content:active, .message-box-container .modal-content, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .sidepanel:focus, .sidepanel:active, .sidepanel, .layout-container-left:focus, .layout-container-left:active, .layout-container-left {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .sidepanel-header-title, .message-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.message-box {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1100;
}
.message-box-container {
  z-index: 1050;
}
.message-box-container .modal-content {
  width: 400px;
  background-color: #495057;
}
.message-box-container .modal-content-large {
  width: 40vw;
}
.message-box-container .modal-content-small {
  width: 15vw;
}
.message-box-container .modal-content .modal-header {
  text-transform: uppercase;
  padding: 0.5em 1rem;
  border-color: #495057;
  background-color: #343a40;
}
.message-box-container .modal-content .modal-body {
  max-height: calc(100vh - 200px);
  overflow-x: hidden;
  overflow-y: auto;
}
.message-box-container .modal-content .modal-footer {
  border-color: #495057;
  padding: 0.5rem 1rem;
  background-color: #343a40;
}

.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .color-picker-container-drop, .command-bar-drop-items, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .sidepanel:focus, .sidepanel:active, .sidepanel, .layout-container-left:focus, .layout-container-left:active, .layout-container-left {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .sidepanel-header-title, .message-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
body {
  overflow: hidden;
}

.layout-container {
  display: flex;
  flex-flow: row;
  overflow: hidden !important;
  height: 100vh;
}
.layout-container-left {
  width: 240px;
  position: relative;
  background-color: #343a40;
  border-right: solid 1px #8fd4ff;
}
.layout-container-right {
  position: relative;
  width: 100%;
}
.layout-container-right-margin {
  margin-left: 10px;
}
.layout-container-right-top {
  background-color: #343a40;
}

.app-layout {
  height: 100vh;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  /*    &-footer {
      position: relative;
      margin: 0;
      padding: 0;
  }*/
}
.app-layout.no-gap {
  margin: 0;
}
.app-layout.inside-panel-with-header {
  height: calc(100vh - 50px);
}
.app-layout.inside-panel-with-top-menu {
  height: calc(100vh - 32px);
}
.app-layout-header {
  position: relative;
  margin: 0;
  padding: 0;
}
.app-layout-body {
  position: relative;
  margin: 0;
  padding: 0;
  flex-grow: 1;
  overflow-x: hidden;
  overflow-y: auto;
}
.app-layout-gap {
  padding: 0 0.5rem;
}

@media (max-width: 991.98px) {
  body {
    overflow-y: auto;
  }
  .layout-container {
    flex-flow: column;
    height: unset;
    overflow-y: auto;
  }
  .layout-container-left {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    box-shadow: none;
    z-index: 1010;
  }
  .layout-container-right {
    padding-top: 50px;
    margin: 0;
  }
  .layout-container-right.menu-hidden {
    padding-top: 0 !important;
  }
  .app-layout {
    height: unset !important;
  }
  .app-layout-body {
    height: 100% !important;
    padding-bottom: 10rem;
    overflow-y: auto;
  }
}
.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .color-picker-container-drop, .command-bar-drop-items, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .sidepanel:focus, .sidepanel:active, .sidepanel, .layout-container-left, .layout-container-left:active, .layout-container-left:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .sidepanel-header-title, .message-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.command-bar {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background-color: transparent;
}
.command-bar-left {
  display: flex;
  flex-direction: row;
  align-self: stretch;
  align-items: baseline;
}
.command-bar-right {
  display: flex;
  flex-direction: row;
  align-self: flex-end;
  align-items: baseline;
}
.command-bar-button > a, .command-bar-button > button {
  padding: 0.5rem 0.5rem;
  font-size: 1rem;
  font-weight: normal;
  text-transform: uppercase;
}
.command-bar-button > a[disabled], .command-bar-button > button[disabled] {
  color: #adb5bd;
}
.command-bar-button:hover {
  background-color: #6c757d;
  color: #f4f2f2;
}
.command-bar-separator {
  align-self: stretch;
  border-right: solid 1px #6c757d;
  margin: 0 0.5rem;
  padding: 0;
}
.command-bar-text {
  font-size: 0.9em;
  font-weight: lighter;
  align-self: center;
  color: #f4f2f2;
}
.command-bar-text > label {
  margin: 0;
  padding: 0;
}
.command-bar-drop-button .command-bar-separator {
  border-right: none !important;
  border-top: solid 1px #6c757d;
  margin-left: 0;
  margin-right: 0;
}
.command-bar-drop {
  position: relative;
  background-color: transparent;
}
.command-bar-drop-toggle {
  display: block;
  padding: 0 0.5rem;
  border: none;
  font-size: 1.5rem;
}
.command-bar-drop-toggle:hover {
  background-color: #6c757d;
  color: #f4f2f2;
}
.command-bar-drop-items {
  position: absolute;
  border: solid 1px #8fd4ff;
  background-color: #495057;
  z-index: 1020;
  right: 0;
}
.command-bar-drop-items.right-aligned {
  right: unset !important;
  left: 0;
}
.command-bar-drop-backdrop {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0);
  z-index: 1010;
}
.command-bar-drop .command-bar-button {
  white-space: nowrap;
  padding-right: 2rem;
}
.command-bar-drop .command-bar-separator {
  border-right: none !important;
  border-top: solid 1px #6c757d;
  margin-left: 0;
  margin-right: 0;
}
.command-bar-drop .command-bar-drop-button > button {
  display: none;
}
.command-bar-drop .command-bar-drop-button > .dropdown-menu {
  position: relative;
  display: block;
  float: none;
  border: none;
  background-color: transparent;
  box-shadow: none !important;
  width: 100% !important;
  padding: 0;
  margin: 0;
}
.command-bar-drop .command-bar-drop-button.command-bar-button {
  padding-right: 0;
}
.command-bar-drop .command-bar-drop-button.command-bar-button:hover {
  background-color: unset !important;
}

.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .color-picker-container-drop, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .sidepanel:focus, .sidepanel:active, .sidepanel, .layout-container-left, .layout-container-left:active, .layout-container-left:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .sidepanel-header-title, .message-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.color-picker-container {
  position: relative;
}
.color-picker-container-drop {
  position: absolute;
  display: none;
  background-color: #6c757d;
  padding: 0.5rem;
  width: 100%;
  margin-top: 0.5rem;
  z-index: 1050;
}
.color-picker-container-drop.visible {
  display: block;
}

.color-picker {
  width: 100%;
}
.color-picker-area {
  position: relative;
  width: 100%;
  height: 100px;
  margin-bottom: 15px;
  border-radius: 3px 3px 0 0;
  background-image: linear-gradient(rgba(0, 0, 0, 0), #000), linear-gradient(90deg, #fff, currentColor);
  cursor: pointer;
}
.color-picker-area-marker {
  position: absolute;
  width: 10px;
  height: 10px;
  margin: -5px 0 0 -5px;
  border: 1px solid #fff;
  border-radius: 20%;
  background-color: currentColor;
  cursor: pointer;
  pointer-events: none;
}
.color-picker-hue {
  position: relative;
  width: 100%;
  height: 16px;
  border-radius: 4px;
  background-image: linear-gradient(to right, #f00 0%, #ff0 16.66%, #0f0 33.33%, #0ff 50%, #00f 66.66%, #f0f 83.33%, #f00 100%);
}
.color-picker-hue-marker {
  position: absolute;
  width: 8px;
  height: 20px;
  left: 0;
  top: 50%;
  margin-left: -4px;
  transform: translateY(-50%);
  border: 2px solid #fff;
  border-radius: 20%;
  background-color: currentColor;
  box-shadow: 0 0 1px #888;
  pointer-events: none;
}
.color-picker-form {
  width: 100%;
  margin-top: 15px;
}
.color-picker-form-input {
  width: 100%;
  padding: 0;
  text-align: center;
  text-transform: uppercase;
  border: none;
  outline: none;
  border: none;
}
.color-picker input[type=range] {
  position: absolute;
  width: calc(100% + 16px);
  height: 16px;
  left: -8px;
  top: -8px;
  margin: 0;
  height: 32px;
  background-color: transparent;
  cursor: pointer;
  opacity: 0;
  appearance: none;
  -webkit-appearance: none;
}
.color-picker input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 16px;
}
.color-picker input[type=range]::-moz-range-track {
  width: 100%;
  height: 16px;
  border: 0;
}
.color-picker input[type=range]::-webkit-slider-thumb {
  width: 8px;
  height: 16px;
  -webkit-appearance: none;
}
.color-picker input[type=range]::-moz-range-thumb {
  width: 8px;
  height: 16px;
  border: 0;
}

.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .sidepanel:focus, .sidepanel:active, .sidepanel, .layout-container-left, .layout-container-left:active, .layout-container-left:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .sidepanel-header-title, .message-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.sidepanel {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  width: 30rem;
  border-left: solid 1px #8fd4ff;
  background-color: #495057;
  z-index: 1050;
  --animate-duration: $animation-fast;
  display: flex;
  flex-direction: column;
}
.sidepanel-header {
  display: flex;
  flex-direction: row;
  border-bottom: solid 1px #8fd4ff;
  padding: 0.5rem;
  background-color: #343a40;
}
.sidepanel-header-title {
  flex-grow: 1;
}
.sidepanel-header-button {
  cursor: pointer;
  color: #f4f2f2;
  font-size: 1.4rem;
  padding: 0 0.5rem;
}
.sidepanel-header-button:hover {
  background-color: #6c757d;
}
.sidepanel-body {
  margin: 0;
  padding: 0;
  flex-grow: 1;
  position: relative;
}
.sidepanel-body.scrollable {
  overflow-y: auto;
}
.sidepanel-gap {
  padding: 0 0.5rem;
}
.sidepanel-large {
  width: 50rem;
}
.sidepanel-small {
  width: 25rem;
}

@media (max-width: 991.98px) {
  .sidepanel {
    width: 30rem;
  }
  .sidepanel-body {
    overflow-y: auto;
  }
  .sidepanel-large {
    width: 40rem;
  }
  .sidepanel-small {
    width: 20rem;
  }
}
@media (max-width: 767.98px) {
  .sidepanel {
    left: 0;
    width: 100%;
    border: none;
  }
  .sidepanel-large {
    left: 0;
    width: 100%;
  }
  .sidepanel-small {
    left: 0;
    width: 100%;
  }
}
.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .message-box-container .modal-content .modal-header, .sidepanel-header-title {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.app-backdrop {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #495057;
  opacity: 0.5;
  z-index: 1040;
  /* Firefox < 16 */
  /* Safari, Chrome and Opera > 12.1 */
  /* Internet Explorer */
  /* Opera < 12.1 */
}
.app-backdrop.transparent {
  opacity: 0;
}
.app-backdrop.matte {
  opacity: 1 !important;
}
.app-backdrop.matte i {
  opacity: 0.5 !important;
}
.app-backdrop-icons {
  position: relative;
  width: 12rem;
  height: 12rem;
}
.app-backdrop-icons-large {
  font-size: 10rem;
}
.app-backdrop-icons-small {
  font-size: 7rem;
  position: absolute;
  right: 0;
  bottom: 0;
}
.app-backdrop-spin-large {
  -webkit-animation: backdrop-icon-spin 3s infinite; /* Safari, Chrome and Opera > 12.1 */
  -moz-animation: backdrop-icon-spin 3s infinite; /* Firefox < 16 */
  -ms-animation: backdrop-icon-spin 3s infinite; /* Internet Explorer */
  -o-animation: backdrop-icon-spin 3s infinite; /* Opera < 12.1 */
  animation: backdrop-icon-spin 3s infinite;
}
.app-backdrop-spin-small {
  -webkit-animation: backdrop-icon-spin 2s infinite; /* Safari, Chrome and Opera > 12.1 */
  -moz-animation: backdrop-icon-spin 2s infinite; /* Firefox < 16 */
  -ms-animation: backdrop-icon-spin 2s infinite; /* Internet Explorer */
  -o-animation: backdrop-icon-spin 2s infinite; /* Opera < 12.1 */
  animation: backdrop-icon-spin 2s infinite;
}
@-moz-keyframes backdrop-icon-spin {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes backdrop-icon-spin {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes backdrop-icon-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.app-backdrop.fade-in {
  -webkit-animation: backdrop-fadein 0.3s; /* Safari, Chrome and Opera > 12.1 */
  -moz-animation: backdrop-fadein 0.3s; /* Firefox < 16 */
  -ms-animation: backdrop-fadein 0.3s; /* Internet Explorer */
  -o-animation: backdrop-fadein 0.3s; /* Opera < 12.1 */
  animation: backdrop-fadein 0.3s;
}
@keyframes backdrop-fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}
@-moz-keyframes backdrop-fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}
@-webkit-keyframes backdrop-fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}
@-ms-keyframes backdrop-fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}
@-o-keyframes backdrop-fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}

.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .message-box-container .modal-content .modal-header, .sidepanel-header-title {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.datepicker-control .form-control {
  cursor: pointer;
}

.datepicker-container {
  display: flex;
  flex-direction: row;
  height: 8rem;
}
.datepicker-container-day {
  width: 6rem;
  height: 8rem;
  border-right: solid 1px #adb5bd;
  border-bottom: solid 1px #adb5bd;
  display: flex;
  flex-direction: column;
}
.datepicker-container-month {
  min-width: 17rem;
  height: 8rem;
  border-right: solid 1px #adb5bd;
  border-bottom: solid 1px #adb5bd;
  display: flex;
  flex-direction: column;
}
.datepicker-container-year {
  min-width: 8rem;
  height: 8rem;
  border-bottom: solid 1px #adb5bd;
  display: flex;
  flex-direction: column;
}
.datepicker-container-hours {
  width: 6rem;
  height: 8rem;
  border-left: solid 3px #adb5bd;
  border-right: solid 1px #adb5bd;
  border-bottom: solid 1px #adb5bd;
  display: flex;
  flex-direction: column;
}
.datepicker-container-minutes {
  width: 6rem;
  height: 8rem;
  border-bottom: solid 1px #adb5bd;
  display: flex;
  flex-direction: column;
}
.datepicker-container-spin {
  height: 2rem;
  background-color: #dee2e6;
  cursor: pointer;
  text-align: center;
  color: #8fd4ff;
}
.datepicker-container-value {
  flex-grow: 1;
  font-size: 3rem;
  color: #8fd4ff;
  text-align: center;
}
.datepicker-footer {
  display: flex;
  flex-direction: row;
  padding: 0.2rem 0.1rem 0.2rem 0.1rem;
}
.datepicker-footer .label {
  font-size: 0.7rem;
  color: #adb5bd;
  text-transform: uppercase;
  margin-left: 0.1rem;
  flex-grow: 1;
  align-self: center;
}
.datepicker-footer .btn {
  min-width: 3rem;
}

.app-shadow-left, .modal-box-container .modal-content:focus, .modal-box-container .modal-content:active, .modal-box-container .modal-content, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .modal-box-container .modal-content .modal-header, .message-box-container .modal-content .modal-header, .sidepanel-header-title {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.modal-box-position {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}

.modal-box {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.modal-box-container {
  z-index: 1050;
}
.modal-box-container .modal-content {
  width: 25vw;
  background-color: #495057;
}
.modal-box-container .modal-content-large {
  width: 40vw;
}
.modal-box-container .modal-content-small {
  width: 15vw;
}
.modal-box-container .modal-content .modal-header {
  text-transform: uppercase;
  padding: 0.5em 1rem;
  border-color: #8fd4ff;
  background-color: #343a40;
}
.modal-box-container .modal-content .modal-body {
  max-height: calc(100vh - 200px);
  overflow-x: hidden;
  overflow-y: auto;
}
.modal-box-container .modal-content .modal-footer {
  border-color: #8fd4ff;
  padding: 0.5rem 1rem;
  background-color: #343a40;
}

.app-shadow-left, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop, .modal-box-container .modal-content, .modal-box-container .modal-content:active, .modal-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .message-box-container .modal-content .modal-header, .sidepanel-header-title, .modal-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.loader-bar-container {
  position: relative;
  margin: 0;
}
.loader-bar-container.no-margin {
  margin: 0 !important;
}
.loader-bar-container .loader-bar, .loader-bar-container .loader-bar-static, .loader-bar-container .loader-bar:before {
  height: 1px;
  width: 100%;
  margin: 0;
}
.loader-bar-container .loader-bar, .loader-bar-container .loader-bar-static {
  background-color: #8fd4ff;
  display: -webkit-flex;
  display: flex;
}
.loader-bar-container .loader-bar:before {
  background-color: #f39e2c;
  content: "";
  -webkit-animation: loader-bar-animation 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
  animation: loader-bar-animation 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
@-webkit-keyframes loader-bar-animation {
  0% {
    margin-left: 0px;
    margin-right: 100%;
  }
  50% {
    margin-left: 0px;
    margin-right: 0px;
  }
  100% {
    margin-left: 100%;
    margin-right: 0;
  }
}
@keyframes loader-bar-animation {
  0% {
    margin-left: 0px;
    margin-right: 100%;
  }
  50% {
    margin-left: 0px;
    margin-right: 0px;
  }
  100% {
    margin-left: 100%;
    margin-right: 0;
  }
}

.app-shadow-left, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop, .modal-box-container .modal-content, .modal-box-container .modal-content:active, .modal-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .message-box-container .modal-content .modal-header, .sidepanel-header-title, .modal-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.no-items {
  padding: 0.5rem;
  border: solid 1px #6c757d;
  border-color: #6c757d;
  font-size: 0.8rem;
  text-align: center;
}
.no-items-label {
  text-align: center;
  color: #adb5bd;
  font-weight: lighter;
  text-transform: uppercase;
}
.no-items-hint {
  color: #6c757d;
  font-weight: lighter;
  text-transform: lowercase;
}

.app-shadow-left, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop, .modal-box-container .modal-content, .modal-box-container .modal-content:active, .modal-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .message-box-container .modal-content .modal-header, .sidepanel-header-title, .modal-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.datagrid-container {
  position: relative;
}
.datagrid-container-loader {
  z-index: 1010;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
}

.datagrid {
  display: grid;
  grid-template-rows: auto;
  border-top: none;
  border-left: none;
  border-right: solid 1px #6c757d;
  border-bottom: solid 1px #6c757d;
  margin-bottom: 0.5rem;
}
.datagrid-header {
  z-index: 1000;
  font-size: 0.9rem;
  font-weight: lighter;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0.3rem 0.5rem;
  border-top: solid 1px #6c757d;
  border-left: solid 1px #6c757d;
  border-bottom: solid 1px #6c757d;
  background-color: #343a40;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}
.datagrid-cell {
  padding: 0.3rem 0.5rem;
  border-top: solid 1px #6c757d;
  border-left: solid 1px #6c757d;
  font-size: 0.9rem;
  font-weight: unset;
}
.datagrid-cell-bool {
  padding-top: 0.5rem;
}
.datagrid-cell-link {
  cursor: pointer;
  color: #8fd4ff;
  text-decoration: none;
}
.datagrid-cell-link:hover {
  text-decoration: underline;
}
.datagrid-cell-expander {
  cursor: pointer;
}
.datagrid-cell-expander:hover {
  background-color: #6c757d;
}
.datagrid-cell.fullspan {
  grid-column-start: first-line;
  grid-column-end: last-line;
}
.datagrid-cell.no-wrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.datagrid-cell.bordered {
  border-top: solid 1px #8fd4ff;
  border-bottom: solid 1px #8fd4ff;
}
.datagrid-cell .btn {
  margin: 0 !important;
  padding: 0 !important;
}
.datagrid-menu-cell {
  padding: 0 !important;
  border-top: solid 1px #dee2e6;
  border-left: solid 1px #dee2e6;
  display: flex;
  flex-direction: column;
}
.datagrid-menu-cell div.dropdown-toggle {
  flex-grow: 1;
  cursor: pointer;
  text-align: center;
  font-size: 0.9rem;
  color: #495057;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.datagrid-menu-cell div.dropdown-toggle:hover {
  background-color: #dee2e6;
}
.datagrid-menu-cell .dropdown-menu {
  padding: 0;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item {
  font-size: 0.9rem;
  text-transform: uppercase;
  border-width: 0 !important;
  padding: 0.3rem 0.8rem;
  color: #495057;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item.primary > i {
  color: #8fd4ff !important;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item.secondary > i {
  color: #adb5bd !important;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item.success > i {
  color: #28a745 !important;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item.info > i {
  color: #17a2b8 !important;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item.warning > i {
  color: #f39e2c !important;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item.danger > i {
  color: #dd3c4d !important;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item.light > i {
  color: #f4f2f2 !important;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item.dark > i {
  color: #343a40 !important;
}
.datagrid-menu-cell .dropdown-menu .dropdown-item:hover {
  background-color: #e9ecef;
  color: #343a40;
}

.app-shadow-left, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop, .modal-box-container .modal-content, .modal-box-container .modal-content:active, .modal-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .message-box-container .modal-content .modal-header, .sidepanel-header-title, .modal-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.flex-component-row {
  display: flex;
  flex-direction: row;
}
.flex-component-row.padding {
  padding: 0.4rem 0.5rem;
}
.flex-component-row.between {
  justify-content: space-between;
}
.flex-component-row.grid-row {
  display: grid;
  gap: 0.3rem;
}
.flex-component-row.bordered {
  border: solid 1px #6c757d;
  border-collapse: collapse;
}
.flex-component-row.bordered.accent {
  border-left-width: 5px;
  border-left-color: #688596;
}
.flex-component-row.bordered.accent-primary {
  border-color: #6c757d;
  border-left-color: #8fd4ff;
}
.flex-component-row.bordered.accent-info {
  border-color: #6c757d;
  border-left-color: #17a2b8;
}
.flex-component-row.bordered.accent-success {
  border-color: #6c757d;
  border-left-color: #28a745;
}
.flex-component-row.bordered.accent-danger {
  border-color: #6c757d;
  border-left-color: #dd3c4d;
}
.flex-component-row.bordered.accent-warning {
  border-color: #6c757d;
  border-left-color: #f39e2c;
}
.flex-component-row.bordered.accent-secondary {
  border-color: #6c757d;
  border-left-color: #adb5bd;
}
.flex-component-row.bordered.clickable {
  cursor: pointer;
}
.flex-component-row.bordered.clickable:hover {
  border-color: #f8f9fa;
  background-color: rgb(79.980625, 87.65, 95.319375);
}
.flex-component-row-cell {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
.flex-component-row-cell.no-padding {
  padding: 0 !important;
}
.flex-component-row-cell.grow {
  flex-grow: 1;
}
.flex-component-row-cell.grow2 {
  flex-grow: 2;
}
.flex-component-row-cell.grow4 {
  flex-grow: 4;
}
.flex-component-row-cell.m-left {
  margin-left: 0.5rem;
}
.flex-component-row-cell.m-right {
  margin-right: 0.5rem;
}
.flex-component-row-cell.content-center {
  justify-content: center;
}
.flex-component-row-cell.content-right {
  justify-content: flex-end;
}
.flex-component-row-separator {
  align-self: stretch;
  margin: 0 0.5rem;
  padding: 0;
}
.flex-component-row-separator.large {
  margin: 0 1rem;
}
.flex-component-row-separator.line {
  border-right: solid 1px #6c757d;
}

@media (max-width: 1199.98px) {
  .flex-component-row.break-lg {
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .flex-component-row.break-lg .flex-component-row-cell {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .flex-component-row.break-lg .flex-component-row-cell:last-child {
    margin-bottom: 0rem;
  }
  .flex-component-row.break-lg .flex-component-row-separator.large, .flex-component-row.break-lg .flex-component-row-separator {
    margin: 1rem 0;
  }
  .flex-component-row.break-lg .flex-component-row-separator.large.line, .flex-component-row.break-lg .flex-component-row-separator.line {
    border-bottom: solid 1px #6c757d;
  }
}
@media (max-width: 991.98px) {
  .flex-component-row.break-md {
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .flex-component-row.break-md .flex-component-row-cell {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .flex-component-row.break-md .flex-component-row-cell:last-child {
    margin-bottom: 0rem;
  }
  .flex-component-row.break-md .flex-component-row-separator.large, .flex-component-row.break-md .flex-component-row-separator {
    margin: 1rem 0;
  }
  .flex-component-row.break-md .flex-component-row-separator.large.line, .flex-component-row.break-md .flex-component-row-separator.line {
    border-bottom: solid 1px #6c757d;
  }
}
@media (max-width: 767.98px) {
  .flex-component-row.break-sm {
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .flex-component-row.break-sm .flex-component-row-cell {
    justify-content: center;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .flex-component-row.break-sm .flex-component-row-cell:last-child {
    margin-bottom: 0rem;
  }
  .flex-component-row.break-sm .flex-component-row-separator.large, .flex-component-row.break-sm .flex-component-row-separator {
    margin: 1rem 0;
  }
  .flex-component-row.break-sm .flex-component-row-separator.large.line, .flex-component-row.break-sm .flex-component-row-separator.line {
    border-bottom: solid 1px #6c757d;
  }
}
.app-shadow-left, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop, .modal-box-container .modal-content, .modal-box-container .modal-content:active, .modal-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .message-box-container .modal-content .modal-header, .sidepanel-header-title, .modal-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.tabs {
  width: 100%;
}
.tabs .nav-link {
  text-transform: uppercase;
  font-size: 0.9em;
  font-weight: 400;
}
.tabs-container.bordered {
  padding: 0.5rem;
  border-left: solid 1px #dee2e6;
  border-right: solid 1px #dee2e6;
  border-bottom: solid 1px #dee2e6;
}

.app-shadow-left, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop, .modal-box-container .modal-content, .modal-box-container .modal-content:active, .modal-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .message-box-container .modal-content .modal-header, .sidepanel-header-title, .modal-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.shine {
  position: relative;
}
.shine-item {
  background: rgb(77.65375, 85.1, 92.54625);
  background-image: linear-gradient(to right, rgb(77.65375, 85.1, 92.54625) 0%, rgb(91.615, 100.4, 109.185) 20%, rgb(77.65375, 85.1, 92.54625) 40%, rgb(77.65375, 85.1, 92.54625) 100%);
  background-repeat: no-repeat;
  background-size: 100vw 104px;
  display: inline-block;
  position: relative;
  -webkit-animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name: placeholderShimmer;
  -webkit-animation-timing-function: linear;
}
.shine-item-control {
  display: block !important;
  width: 100%;
  height: 1.6rem;
  margin-top: 0.5rem;
  border-radius: 0.2rem;
}
.shine-item-label {
  height: 10px;
  margin-top: 1rem;
  width: 40%;
  max-width: 10rem;
  border-radius: 0.1rem;
}
@-webkit-keyframes placeholderShimmer {
  0% {
    background-position: -100vw 0;
  }
  100% {
    background-position: 100vw 0;
  }
}

.app-shadow-left, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop, .modal-box-container .modal-content, .modal-box-container .modal-content:active, .modal-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .header-title, .message-box-container .modal-content .modal-header, .sidepanel-header-title, .modal-box-container .modal-content .modal-header {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.header-title {
  margin: 0.4rem 0;
}
.header-title.small {
  font-size: 1.1rem;
}
.header-title.large {
  font-size: 1.8rem;
}

@media (max-width: 767.98px) {
  .header-title {
    font-size: 1.1rem;
  }
  .header-title.small {
    font-size: 0.9rem;
  }
  .header-title.large {
    font-size: 1.5rem;
  }
}
.app-shadow-left, .dropdown-menu,
.dropdown-menu:active,
.dropdown-menu:focus, .message-box-container .modal-content, .message-box-container .modal-content:active, .message-box-container .modal-content:focus, .command-bar-drop-items, .color-picker-container-drop, .modal-box-container .modal-content, .modal-box-container .modal-content:active, .modal-box-container .modal-content:focus {
  box-shadow: #212529 5px 0 10px !important;
}

.app-shadow-right, .layout-container-left, .layout-container-left:active, .layout-container-left:focus, .sidepanel, .sidepanel:active, .sidepanel:focus {
  box-shadow: #212529 -5px 0 10px !important;
}

.app-title, .message-box-container .modal-content .modal-header, .sidepanel-header-title, .modal-box-container .modal-content .modal-header, .header-title {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: lighter;
  color: #f4f2f2;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }
}
.selectable-canvas {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: #dd3c4d;
  border: none;
  height: 100%;
}
.selectable-canvas.ratio_4x3 {
  padding-bottom: 75%;
  height: unset !important;
}
.selectable-canvas.ratio_16x9 {
  padding-bottom: 56.25%;
  height: unset !important;
}
.selectable-canvas .plane {
  border: none;
  position: absolute;
  right: 0;
  left: 0;
  bottom: 0;
  top: 0;
}
.selectable-canvas .image {
  border: none;
  width: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.selectable-canvas .guide {
  pointer-events: none;
  position: absolute;
}
.selectable-canvas .guide-h {
  left: 0;
  right: 0;
  height: 1px;
  border-bottom: solid 1px #adb5bd;
}
.selectable-canvas .guide-v {
  top: 0;
  bottom: 0;
  width: 1px;
  border-right: solid 1px #adb5bd;
}
.selectable-canvas .selection {
  pointer-events: none;
  position: absolute;
  border: solid 1px #f39e2c;
  background-color: rgba(255, 255, 255, 0.2);
}
.selectable-canvas .rectangle {
  pointer-events: all;
  position: absolute;
  border: solid 1px #8fd4ff;
  background-color: rgba(255, 255, 255, 0.2);
}
.selectable-canvas .rectangle .identifier {
  font-size: 1rem;
  font-weight: bold;
  color: white;
  margin: 3px 0 0 2px;
  background-color: rgba(0, 0, 0, 0.4);
}

a.middle {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.btn.disabled {
  cursor: default !important;
}

.dropdown-toggle.hide-arrow::before, .dropdown-toggle.hide-arrow::after {
  display: none !important;
}

.list-group-item.item-sm {
  padding: 0.3rem 0.5rem;
}

.list-group-item-action:focus {
  color: #fff;
  background-color: #495057;
}
.list-group-item-action:hover {
  color: #fff;
  background-color: #6c757d;
}

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

.form-group-disable .form-group {
  margin-bottom: 0 !important;
}

.form-control {
  border: none !important;
  color: #000 !important;
}
.form-control.readonly {
  background-color: #6c757d !important;
}
.form-control > input {
  border-color: #fff !important;
}
.form-control-wrap {
  height: unset !important;
}
.form-control-danger {
  background-color: rgb(247.5021834061, 211.9978165939, 215.7467248908) !important;
  border-left: solid 10px #dd3c4d !important;
}
.form-control-exclamation {
  background-color: rgb(252.6053811659, 235.6434977578, 212.8946188341) !important;
  border-left: solid 10px #f39e2c !important;
}

.bg-secondary-light {
  background-color: #f8f9fa;
}

.transparency-25 {
  opacity: 0.75;
}
.transparency-50 {
  opacity: 0.5;
}
.transparency-75 {
  opacity: 0.25;
}
.transparency-90 {
  opacity: 0.1;
}
.transparency-100 {
  opacity: 0;
}

.gap {
  gap: 0.5rem;
}
.gap-sm {
  gap: 0.25rem;
}
.gap-lg {
  gap: 1rem;
}
.gap-xl {
  gap: 1.5rem;
}

.border-box {
  border: solid 1px #6c757d;
  padding: 0.5rem;
}
.border-box.no-upper {
  border-top: none;
}
.border-box.block {
  width: 100%;
}
.border-box.clickable {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.border-box.clickable:hover {
  border-color: #e9ecef;
}
.border-box.primary {
  border-color: #8fd4ff;
}
.border-box.success {
  border-color: #28a745;
}
.border-box.danger {
  border-color: #dd3c4d;
}
.border-box.warning {
  border-color: #f39e2c;
}
.border-box.secondary {
  border-color: #6c757d;
}
.border-box.info {
  border-color: #17a2b8;
}
.border-box.accent {
  border-left-width: 5px;
  border-left-color: #adb5bd;
}
.border-box.accent-primary {
  border-color: #6c757d;
  border-left-color: #8fd4ff;
}
.border-box.accent-success {
  border-color: #6c757d;
  border-left-color: #28a745;
}
.border-box.accent-danger {
  border-color: #6c757d;
  border-left-color: #dd3c4d;
}
.border-box.accent-warning {
  border-color: #6c757d;
  border-left-color: #f39e2c;
}
.border-box.accent-secondary {
  border-color: #6c757d;
  border-left-color: #adb5bd;
}
.border-box.accent-info {
  border-color: #6c757d;
  border-left-color: #17a2b8;
}

.block-button {
  border: solid 1px #6c757d;
  color: #8fd4ff;
  padding: 0.5rem;
  cursor: pointer;
  text-align: center;
  text-transform: uppercase;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.block-button:hover {
  border-color: #e9ecef;
}
.block-button.primary {
  border-color: #8fd4ff;
}
.block-button.success {
  border-color: #28a745;
}
.block-button.danger {
  border-color: #dd3c4d;
}
.block-button.secondary {
  border-color: #6c757d;
}

:focus, :active, :visited {
  outline: none !important;
  box-shadow: none !important;
}

.badge {
  font-size: 1em;
  font-weight: normal;
  text-transform: uppercase;
}

.badge-pill {
  padding-right: 0.6em;
  padding-left: 0.6em;
  border-radius: 10rem;
}

.btn {
  text-transform: uppercase;
}
.btn.no-upper {
  text-transform: unset !important;
}
.btn-transparent {
  border-color: transparent;
}
.btn-transparent > span {
  color: #495057;
}
.btn-transparent:hover {
  border-color: transparent;
}
.btn-link {
  color: #8fd4ff;
  text-decoration: none !important;
}
.btn-link:hover {
  color: #8fd4ff;
  text-decoration: none !important;
}

.alert-sm {
  padding: 0.25rem 0.75rem;
  margin-bottom: 0.7rem;
}

.text-link:hover {
  color: #e9ecef;
}

.spacer {
  height: 1px;
}
.spacer-hr {
  height: 1px;
  margin: 0 !important;
  padding: 0 !important;
  background-color: #8fd4ff;
}
.spacer.small {
  padding: 0.25rem 0;
}
.spacer.medium {
  padding: 0.5rem 0;
}
.spacer.large {
  padding: 1.5rem 0;
}

textarea {
  resize: none !important;
  height: 10rem;
}

.data-label-accent .data-label, .data-label-accent .top-label-text {
  font-weight: bold;
  color: #8fd4ff;
}

.data-label, .top-label-text {
  font-size: 0.75rem;
  color: #adb5bd;
  text-transform: uppercase;
}
@media screen and (max-width: 768px) {
  .data-label, .top-label-text {
    font-size: 0.7rem;
  }
}

.data-title {
  font-size: 0.9rem;
  color: #adb5bd !important;
  font-weight: 600;
  text-transform: uppercase;
}
.data-title.high {
  font-size: 1rem;
  color: #333333;
}
@media screen and (max-width: 768px) {
  .data-title {
    font-size: 0.8rem;
  }
}

.data-value {
  font-size: 0.9rem;
  color: #f4f2f2 !important;
  font-weight: unset;
}
.data-value.no-upper {
  text-transform: unset !important;
}
@media screen and (max-width: 768px) {
  .data-value {
    font-size: 0.8rem;
  }
}

.data-error {
  font-size: 0.7rem;
  color: #dd3c4d !important;
  text-transform: uppercase;
}

i.bool-value {
  font-size: 1.2rem;
}

a.data-link {
  font-size: 0.9rem;
  color: #8fd4ff;
  text-decoration: none !important;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  a.data-link {
    font-size: 0.8rem;
  }
}
a.data-link.upper {
  text-transform: uppercase;
}
a.data-link > span {
  text-decoration: none !important;
}
a.data-link .data-value {
  color: #8fd4ff;
  text-decoration: none !important;
}
a.data-link .data-label, a.data-link .top-label-text {
  color: #8fd4ff;
  text-decoration: none !important;
}
a.data-link .data-title {
  color: #8fd4ff;
  text-decoration: none !important;
}

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

.cursor-pointer {
  cursor: pointer !important;
}

form .data-label, form .top-label-text {
  margin-bottom: 0 !important;
  margin-left: 1px !important;
}
form .validation-message {
  color: rgb(236.1441048035, 146.8558951965, 156.2838427948);
  font-size: 0.7rem;
  margin-left: 1px !important;
  text-transform: uppercase;
}
form .hint-message {
  color: #adb5bd;
  font-size: 0.6rem;
  text-transform: uppercase;
  margin-left: 1px !important;
}

.checkbox .form-control {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background-color: transparent !important;
  color: #f4f2f2 !important;
}
.checkbox-hint {
  color: #adb5bd;
  text-transform: uppercase;
  font-size: 0.7rem;
  margin-left: 2.6rem;
}
.checkbox.disabled {
  opacity: 0.5;
}
.checkbox-container {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.checkbox-container-clickable {
  cursor: pointer;
}
.checkbox-container-left {
  margin-right: 0.5rem;
  font-size: 1.2rem;
}
.checkbox-container-right {
  flex-grow: 1;
}

.height-unset {
  height: unset !important;
}

.text-xs {
  font-size: 0.7em;
  line-height: 1rem;
}
.text-sm {
  font-size: 0.8em;
  line-height: 1rem;
}
.text-lg {
  font-size: 1.2em;
  line-height: 1.6em;
}
.text-link {
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer !important;
  color: #dee2e6 !important;
}
.text-link:hover {
  color: #f8f9fa !important;
  text-decoration: underline !important;
}

.border-secondary-light {
  border-color: #adb5bd;
}
.border-secondary-light.no-top {
  border-top-style: none !important;
}

.font-light {
  font-weight: 300;
}

.text-ellipsis {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.top-label-content > .header-title {
  margin: 0 !important;
}

.height-fill {
  height: 100% !important;
}

.input-text-readonly {
  width: 100%;
  border: none;
  margin: 0;
  padding: 0;
  background-color: transparent;
  color: white;
}

@media (max-width: 767.98px) {
  .hide-sm {
    display: none;
  }
  .w-sm-100 {
    width: 100%;
  }
}
@media (max-width: 991.98px) {
  .hide-md {
    display: none;
  }
  .w-md-100 {
    width: 100%;
  }
}
@media (max-width: 1199.98px) {
  .hide-lg {
    display: none;
  }
  .w-lg-100 {
    width: 100%;
  }
}
.justify-content-evenly {
  justify-content: space-between;
}

.separator-caption {
  text-transform: uppercase;
  font-size: 1.2rem;
  font-weight: lighter;
  color: #f4f2f2;
  margin: 0;
}

@media (max-width: 767.98px) {
  .separator-caption {
    font-size: 0.9rem;
  }
}
@media (min-width: 767.98px) {
  .width-sm-10 {
    width: 10%;
  }
  .width-sm-15 {
    width: 15%;
  }
  .width-sm-25 {
    width: 25%;
  }
}
@media (min-width: 767.98px) {
  .width-sm-100 {
    width: 100%;
  }
}
@media (min-width: 991.98px) {
  .width-md-10 {
    width: 10%;
  }
  .width-md-15 {
    width: 15%;
  }
  .width-md-25 {
    width: 25%;
  }
}
@media (max-width: 991.98px) {
  .width-md-100 {
    width: 100%;
  }
}