@charset "UTF-8";
.material-icons.md-18 {
  font-size: 18px;
}

.material-icons.md-24 {
  font-size: 24px;
}

.material-icons.md-36 {
  font-size: 36px;
}

.material-icons.md-48 {
  font-size: 48px;
}

html,
body,
.application-container {
  height: 100%;
  font-size: 13px;
  color: #15394C;
  line-height: 1.5;
  background-color: #eff1f5;
  box-sizing: border-box;
}
html :fullscreen,
body :fullscreen,
.application-container :fullscreen {
  background-color: #eff1f5;
  width: 100%;
  height: 100%;
}
html :-webkit-full-screen,
body :-webkit-full-screen,
.application-container :-webkit-full-screen {
  background-color: #eff1f5;
  width: 100%;
  height: 100%;
}

html,
select,
textarea,
input {
  font-family: "Open Sans", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Open Sans", sans-serif;
}

div {
  display: block;
}

md-content.md-default-theme,
md-content {
  color: #15394C;
}

md-icon.svg-icon path {
  stroke: rgba(0, 0, 0, 0.54);
}

body {
  -webkit-font-feature-settings: "kern" 1;
  -moz-font-feature-settings: "kern" 1;
  -o-font-feature-settings: "kern" 1;
  font-feature-settings: "kern" 1;
  font-kerning: normal;
}

code {
  font-family: "Menlo", "monospace", "Open Sans";
}

.h1 {
  font-family: "Open Sans", sans-serif;
  font-size: 28px;
  line-height: 1.24;
  font-weight: 700;
  color: #000000;
  margin: 0;
}

.text-capitalize {
  text-transform: capitalize !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

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

.force-capitalize {
  display: inline-block;
  text-transform: lowercase;
}

.force-capitalize::first-letter {
  text-transform: uppercase;
}

.faded-text {
  opacity: 0.5;
}

.md-body-1 {
  font-size: 13px;
  line-height: 1.5;
}

.md-caption-1 {
  font-size: 11px !important;
}

a {
  text-decoration: none;
  color: #207da9;
  line-height: 1.5;
}
a md-icon {
  color: inherit;
}
a md-icon path {
  fill: currentColor;
}
a:visited {
  color: #207da9;
}
a:hover {
  color: rgb(25.6, 100, 135.2);
}
a:active {
  color: rgb(20.48, 80, 108.16);
}
a[href^="mailto:"] {
  text-decoration: none;
  color: #207da9;
}
a[href^="mailto:"]:visited {
  color: #207da9;
}
a[href^="mailto:"]:hover {
  color: rgb(25.6, 100, 135.2);
}
a[href^="mailto:"]:active {
  color: rgb(20.48, 80, 108.16);
}
a.link--dark {
  color: #17384c;
}
a.link--dark:visited {
  color: #17384c;
}
a.link--dark:hover {
  color: rgb(18.4, 44.8, 60.8);
}
a.link--dark:active {
  color: rgb(14.72, 35.84, 48.64);
}
a > .material-icons {
  color: inherit;
}

md-toolbar.dt-theme {
  background-color: transparent !important;
}

md-toast.dt-theme {
  position: fixed;
}
md-toast.dt-theme .md-button {
  margin-right: 0;
}
md-toast.dt-theme .material-icons {
  color: rgba(255, 255, 255, 0.87);
}

md-tabs.dt-theme {
  height: 42px;
  background-color: #324249;
  border-radius: 0;
}
md-tabs.dt-theme md-tabs-canvas,
md-tabs.dt-theme md-pagination-wrapper {
  height: 42px;
}
md-tabs.dt-theme md-prev-button md-icon,
md-tabs.dt-theme md-next-button md-icon {
  color: rgba(255, 255, 255, 0.87);
}
md-tabs.dt-theme .md-tab {
  position: relative;
  height: 42px;
  padding: 8px 16px 16px !important;
  color: rgba(255, 255, 255, 0.6) !important;
}
md-tabs.dt-theme .md-tab.md-active {
  cursor: default;
  color: #fff !important;
}
md-tabs.dt-theme .md-tab .md-menu {
  position: absolute;
  top: 50%;
  padding: 0;
  margin-top: -12px;
}
md-tabs.dt-theme .md-tab .material-icons {
  position: relative;
  top: -2px;
  margin-right: 3px;
  color: inherit;
}
md-tabs.dt-theme md-ink-bar {
  color: #fff;
  background: #fff;
}

md-chips.dt-chips.dt-theme md-chip {
  background-color: #fcfdfd;
  height: 30px;
  line-height: 26px;
  font-size: 13px;
  font-family: "Open Sans", sans-serif;
  color: #15394C;
  border: 1px solid #c1ccd8;
  box-shadow: 0 1px 2px 0 #e6eaed;
  margin: 2px 8px 4px 2px;
}
md-chips.dt-chips.dt-theme md-chip .md-chip-remove-container {
  line-height: 0;
}
md-chips.dt-chips.dt-theme .md-chips {
  box-shadow: 0 1px rgba(32, 125, 169, 0.54);
  min-height: 30px;
}
md-chips.dt-chips.dt-theme .md-chips.md-readonly {
  box-shadow: 0 1px #c9cdce;
}
md-chips.dt-chips.dt-theme .md-chips.md-focused {
  box-shadow: 0 2px #207da9;
}

md-list-item.md-2-line.dt-theme .md-avatar-icon {
  background-color: #17384c;
  border-radius: 2px;
  font-size: 32px;
  line-height: 1;
  padding: 16px;
  vertical-align: top;
}
md-list-item.md-2-line.dt-theme .md-list-item-text h3,
md-list-item.md-2-line.dt-theme > .md-no-style .md-list-item-text h3 {
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  color: #17384c;
  font-weight: normal;
}
md-list-item.md-2-line.dt-theme .md-list-item-text p,
md-list-item.md-2-line.dt-theme > .md-no-style .md-list-item-text p {
  font-family: "Open Sans", sans-serif;
  color: #17384c;
  font-size: 13px;
  font-weight: normal;
}
md-list-item.md-2-line.dt-theme.md-2-line--active .md-avatar-icon {
  background-color: #679FBA;
}
md-list-item.md-2-line.dt-theme.md-2-line--active .md-list-item-text h3,
md-list-item.md-2-line.dt-theme.md-2-line--active > .md-no-style .md-list-item-text h3 {
  color: #679FBA;
}
md-list-item.md-2-line.dt-theme.md-2-line--active .md-list-item-text p,
md-list-item.md-2-line.dt-theme.md-2-line--active > .md-no-style .md-list-item-text p {
  color: #679FBA;
}

.dt-theme .md-toast-content {
  background-color: #3e4a4f;
  border-radius: 4px;
  box-shadow: 0 7px 14px 0 rgba(60, 66, 87, 0.08), 0 3px 6px 0 rgba(0, 0, 0, 0.12);
}
.dt-theme .md-toast-content md-icon path {
  fill: #fafafa !important;
}
.dt-theme .md-toast-content ::first-letter {
  text-transform: capitalize;
}

.dt-toast-success {
  left: 50%;
  margin-left: -100px;
}
.dt-toast-success .md-toast-content {
  border-radius: 6px;
  background-color: #7cb26b;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.1882352941);
  border: 1px solid rgba(66, 112, 52, 0.3921568627);
  font-weight: 600;
  box-shadow: 0 6px 6px -4px rgba(56, 86, 47, 0.3019607843);
}

.page-title {
  font-family: "Open Sans", sans-serif;
  font-size: 20px;
  line-height: 1.24;
  font-weight: normal;
  text-transform: capitalize;
}

.block-title, .popover-preferences__subtitle {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-family: "Open Sans", sans-serif;
  font-size: 11px;
  line-height: 1.36;
  text-transform: uppercase;
  font-weight: bold;
  color: #232d33;
  margin: 16px 0 8px;
}

.block-description {
  color: #17384c;
  line-height: 1.33;
  margin-bottom: 12px;
}

.content-title {
  font-family: "Open Sans", sans-serif;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.33;
  color: #679FBA;
  text-transform: uppercase;
}

@media (min-width: 960px) {
  .hide-desktop {
    display: none;
  }
}

@media (min-width: 736px) and (max-width: 959px) {
  .hide-tablet {
    display: none;
  }
}

@media (min-width: 736px) {
  .hide-gt-mobile {
    display: none;
  }
}

@media (max-width: 735px) {
  .hide-mobile {
    display: none;
  }
}

@media (max-width: 1365px) {
  .hide-lt-wide {
    display: none;
  }
}

/**
 * This component lets you use spacing more transparent and flexible,
 * by adding [[Space Class]] to block.
 *
 * Example HTML:
 *
 * <div class="space-m-t-n"></div>
 * [[sm, md, md-lg, lg]-space-[m,p]-[t,b,l,r,v,h] - [n, xs, s, m, l, xl]
 *
 * [sm, md, md-lg, lg] - use one of this prefix for media breakpoints
 * space - Class name
 * [m, p] - m - using maring, p - using padding
 * [t,b,l,r,v,h] - prefix for direction can be: top, bottom, left, right, vertical, horizontal
 * [n, xs, s, m, l, xl] - stronger of space
 */
.space-m-t-n {
  margin-top: 0 !important;
}

.space-p-t-n {
  padding-top: 0 !important;
}

.space-m-b-n {
  margin-bottom: 0 !important;
}

.space-p-b-n {
  padding-bottom: 0 !important;
}

.space-m-l-n {
  margin-left: 0 !important;
}

.space-p-l-n {
  padding-left: 0 !important;
}

.space-m-r-n {
  margin-right: 0 !important;
}

.space-p-r-n {
  padding-right: 0 !important;
}

.space-m-v-n {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.space-p-v-n {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.space-m-h-n {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.space-p-h-n {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.space-m-t-xs {
  margin-top: 4px !important;
}

.space-p-t-xs {
  padding-top: 4px !important;
}

.space-m-b-xs {
  margin-bottom: 4px !important;
}

.space-p-b-xs {
  padding-bottom: 4px !important;
}

.space-m-l-xs {
  margin-left: 4px !important;
}

.space-p-l-xs {
  padding-left: 4px !important;
}

.space-m-r-xs {
  margin-right: 4px !important;
}

.space-p-r-xs {
  padding-right: 4px !important;
}

.space-m-v-xs {
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

.space-p-v-xs {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.space-m-h-xs {
  margin-left: 4px !important;
  margin-right: 4px !important;
}

.space-p-h-xs {
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.space-m-t-s {
  margin-top: 8px !important;
}

.space-p-t-s {
  padding-top: 8px !important;
}

.space-m-b-s {
  margin-bottom: 8px !important;
}

.space-p-b-s {
  padding-bottom: 8px !important;
}

.space-m-l-s {
  margin-left: 8px !important;
}

.space-p-l-s {
  padding-left: 8px !important;
}

.space-m-r-s {
  margin-right: 8px !important;
}

.space-p-r-s {
  padding-right: 8px !important;
}

.space-m-v-s {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

.space-p-v-s {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.space-m-h-s {
  margin-left: 8px !important;
  margin-right: 8px !important;
}

.space-p-h-s {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.space-m-t-m {
  margin-top: 16px !important;
}

.space-p-t-m {
  padding-top: 16px !important;
}

.space-m-b-m {
  margin-bottom: 16px !important;
}

.space-p-b-m {
  padding-bottom: 16px !important;
}

.space-m-l-m {
  margin-left: 16px !important;
}

.space-p-l-m {
  padding-left: 16px !important;
}

.space-m-r-m {
  margin-right: 16px !important;
}

.space-p-r-m {
  padding-right: 16px !important;
}

.space-m-v-m {
  margin-top: 16px !important;
  margin-bottom: 16px !important;
}

.space-p-v-m {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

.space-m-h-m {
  margin-left: 16px !important;
  margin-right: 16px !important;
}

.space-p-h-m {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.space-m-t-l {
  margin-top: 24px !important;
}

.space-p-t-l {
  padding-top: 24px !important;
}

.space-m-b-l {
  margin-bottom: 24px !important;
}

.space-p-b-l {
  padding-bottom: 24px !important;
}

.space-m-l-l {
  margin-left: 24px !important;
}

.space-p-l-l {
  padding-left: 24px !important;
}

.space-m-r-l {
  margin-right: 24px !important;
}

.space-p-r-l {
  padding-right: 24px !important;
}

.space-m-v-l {
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

.space-p-v-l {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

.space-m-h-l {
  margin-left: 24px !important;
  margin-right: 24px !important;
}

.space-p-h-l {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

.space-m-t-xl {
  margin-top: 32px !important;
}

.space-p-t-xl {
  padding-top: 32px !important;
}

.space-m-b-xl {
  margin-bottom: 32px !important;
}

.space-p-b-xl {
  padding-bottom: 32px !important;
}

.space-m-l-xl {
  margin-left: 32px !important;
}

.space-p-l-xl {
  padding-left: 32px !important;
}

.space-m-r-xl {
  margin-right: 32px !important;
}

.space-p-r-xl {
  padding-right: 32px !important;
}

.space-m-v-xl {
  margin-top: 32px !important;
  margin-bottom: 32px !important;
}

.space-p-v-xl {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

.space-m-h-xl {
  margin-left: 32px !important;
  margin-right: 32px !important;
}

.space-p-h-xl {
  padding-left: 32px !important;
  padding-right: 32px !important;
}

.space-m-t-xxl {
  margin-top: 64px !important;
}

.space-p-t-xxl {
  padding-top: 64px !important;
}

.space-m-b-xxl {
  margin-bottom: 64px !important;
}

.space-p-b-xxl {
  padding-bottom: 64px !important;
}

.space-m-l-xxl {
  margin-left: 64px !important;
}

.space-p-l-xxl {
  padding-left: 64px !important;
}

.space-m-r-xxl {
  margin-right: 64px !important;
}

.space-p-r-xxl {
  padding-right: 64px !important;
}

.space-m-v-xxl {
  margin-top: 64px !important;
  margin-bottom: 64px !important;
}

.space-p-v-xxl {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

.space-m-h-xxl {
  margin-left: 64px !important;
  margin-right: 64px !important;
}

.space-p-h-xxl {
  padding-left: 64px !important;
  padding-right: 64px !important;
}

.space-m-t-quarter {
  margin-top: 25% !important;
}

.space-p-t-quarter {
  padding-top: 25% !important;
}

.space-m-b-quarter {
  margin-bottom: 25% !important;
}

.space-p-b-quarter {
  padding-bottom: 25% !important;
}

.space-m-l-quarter {
  margin-left: 25% !important;
}

.space-p-l-quarter {
  padding-left: 25% !important;
}

.space-m-r-quarter {
  margin-right: 25% !important;
}

.space-p-r-quarter {
  padding-right: 25% !important;
}

.space-m-v-quarter {
  margin-top: 25% !important;
  margin-bottom: 25% !important;
}

.space-p-v-quarter {
  padding-top: 25% !important;
  padding-bottom: 25% !important;
}

.space-m-h-quarter {
  margin-left: 25% !important;
  margin-right: 25% !important;
}

.space-p-h-quarter {
  padding-left: 25% !important;
  padding-right: 25% !important;
}

.space-m-t-half {
  margin-top: 50% !important;
}

.space-p-t-half {
  padding-top: 50% !important;
}

.space-m-b-half {
  margin-bottom: 50% !important;
}

.space-p-b-half {
  padding-bottom: 50% !important;
}

.space-m-l-half {
  margin-left: 50% !important;
}

.space-p-l-half {
  padding-left: 50% !important;
}

.space-m-r-half {
  margin-right: 50% !important;
}

.space-p-r-half {
  padding-right: 50% !important;
}

.space-m-v-half {
  margin-top: 50% !important;
  margin-bottom: 50% !important;
}

.space-p-v-half {
  padding-top: 50% !important;
  padding-bottom: 50% !important;
}

.space-m-h-half {
  margin-left: 50% !important;
  margin-right: 50% !important;
}

.space-p-h-half {
  padding-left: 50% !important;
  padding-right: 50% !important;
}

.space-m-t-three-quarter {
  margin-top: 75% !important;
}

.space-p-t-three-quarter {
  padding-top: 75% !important;
}

.space-m-b-three-quarter {
  margin-bottom: 75% !important;
}

.space-p-b-three-quarter {
  padding-bottom: 75% !important;
}

.space-m-l-three-quarter {
  margin-left: 75% !important;
}

.space-p-l-three-quarter {
  padding-left: 75% !important;
}

.space-m-r-three-quarter {
  margin-right: 75% !important;
}

.space-p-r-three-quarter {
  padding-right: 75% !important;
}

.space-m-v-three-quarter {
  margin-top: 75% !important;
  margin-bottom: 75% !important;
}

.space-p-v-three-quarter {
  padding-top: 75% !important;
  padding-bottom: 75% !important;
}

.space-m-h-three-quarter {
  margin-left: 75% !important;
  margin-right: 75% !important;
}

.space-p-h-three-quarter {
  padding-left: 75% !important;
  padding-right: 75% !important;
}

@media only screen and (max-width: 764px) {
  .sm-space-m-t-n {
    margin-top: 0 !important;
  }
  .sm-space-p-t-n {
    padding-top: 0 !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-n {
    margin-bottom: 0 !important;
  }
  .sm-space-p-b-n {
    padding-bottom: 0 !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-n {
    margin-left: 0 !important;
  }
  .sm-space-p-l-n {
    padding-left: 0 !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-n {
    margin-right: 0 !important;
  }
  .sm-space-p-r-n {
    padding-right: 0 !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-n {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .sm-space-p-v-n {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-n {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .sm-space-p-h-n {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-t-xs {
    margin-top: 4px !important;
  }
  .sm-space-p-t-xs {
    padding-top: 4px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-xs {
    margin-bottom: 4px !important;
  }
  .sm-space-p-b-xs {
    padding-bottom: 4px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-xs {
    margin-left: 4px !important;
  }
  .sm-space-p-l-xs {
    padding-left: 4px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-xs {
    margin-right: 4px !important;
  }
  .sm-space-p-r-xs {
    padding-right: 4px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-xs {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
  }
  .sm-space-p-v-xs {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-xs {
    margin-left: 4px !important;
    margin-right: 4px !important;
  }
  .sm-space-p-h-xs {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-t-s {
    margin-top: 8px !important;
  }
  .sm-space-p-t-s {
    padding-top: 8px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-s {
    margin-bottom: 8px !important;
  }
  .sm-space-p-b-s {
    padding-bottom: 8px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-s {
    margin-left: 8px !important;
  }
  .sm-space-p-l-s {
    padding-left: 8px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-s {
    margin-right: 8px !important;
  }
  .sm-space-p-r-s {
    padding-right: 8px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-s {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
  }
  .sm-space-p-v-s {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-s {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }
  .sm-space-p-h-s {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-t-m {
    margin-top: 16px !important;
  }
  .sm-space-p-t-m {
    padding-top: 16px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-m {
    margin-bottom: 16px !important;
  }
  .sm-space-p-b-m {
    padding-bottom: 16px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-m {
    margin-left: 16px !important;
  }
  .sm-space-p-l-m {
    padding-left: 16px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-m {
    margin-right: 16px !important;
  }
  .sm-space-p-r-m {
    padding-right: 16px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-m {
    margin-top: 16px !important;
    margin-bottom: 16px !important;
  }
  .sm-space-p-v-m {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-m {
    margin-left: 16px !important;
    margin-right: 16px !important;
  }
  .sm-space-p-h-m {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-t-l {
    margin-top: 24px !important;
  }
  .sm-space-p-t-l {
    padding-top: 24px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-l {
    margin-bottom: 24px !important;
  }
  .sm-space-p-b-l {
    padding-bottom: 24px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-l {
    margin-left: 24px !important;
  }
  .sm-space-p-l-l {
    padding-left: 24px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-l {
    margin-right: 24px !important;
  }
  .sm-space-p-r-l {
    padding-right: 24px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-l {
    margin-top: 24px !important;
    margin-bottom: 24px !important;
  }
  .sm-space-p-v-l {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-l {
    margin-left: 24px !important;
    margin-right: 24px !important;
  }
  .sm-space-p-h-l {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-t-xl {
    margin-top: 32px !important;
  }
  .sm-space-p-t-xl {
    padding-top: 32px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-xl {
    margin-bottom: 32px !important;
  }
  .sm-space-p-b-xl {
    padding-bottom: 32px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-xl {
    margin-left: 32px !important;
  }
  .sm-space-p-l-xl {
    padding-left: 32px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-xl {
    margin-right: 32px !important;
  }
  .sm-space-p-r-xl {
    padding-right: 32px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-xl {
    margin-top: 32px !important;
    margin-bottom: 32px !important;
  }
  .sm-space-p-v-xl {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-xl {
    margin-left: 32px !important;
    margin-right: 32px !important;
  }
  .sm-space-p-h-xl {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-t-xxl {
    margin-top: 64px !important;
  }
  .sm-space-p-t-xxl {
    padding-top: 64px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-xxl {
    margin-bottom: 64px !important;
  }
  .sm-space-p-b-xxl {
    padding-bottom: 64px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-xxl {
    margin-left: 64px !important;
  }
  .sm-space-p-l-xxl {
    padding-left: 64px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-xxl {
    margin-right: 64px !important;
  }
  .sm-space-p-r-xxl {
    padding-right: 64px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-xxl {
    margin-top: 64px !important;
    margin-bottom: 64px !important;
  }
  .sm-space-p-v-xxl {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-xxl {
    margin-left: 64px !important;
    margin-right: 64px !important;
  }
  .sm-space-p-h-xxl {
    padding-left: 64px !important;
    padding-right: 64px !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-t-quarter {
    margin-top: 25% !important;
  }
  .sm-space-p-t-quarter {
    padding-top: 25% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-quarter {
    margin-bottom: 25% !important;
  }
  .sm-space-p-b-quarter {
    padding-bottom: 25% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-quarter {
    margin-left: 25% !important;
  }
  .sm-space-p-l-quarter {
    padding-left: 25% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-quarter {
    margin-right: 25% !important;
  }
  .sm-space-p-r-quarter {
    padding-right: 25% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-quarter {
    margin-top: 25% !important;
    margin-bottom: 25% !important;
  }
  .sm-space-p-v-quarter {
    padding-top: 25% !important;
    padding-bottom: 25% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-quarter {
    margin-left: 25% !important;
    margin-right: 25% !important;
  }
  .sm-space-p-h-quarter {
    padding-left: 25% !important;
    padding-right: 25% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-t-half {
    margin-top: 50% !important;
  }
  .sm-space-p-t-half {
    padding-top: 50% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-half {
    margin-bottom: 50% !important;
  }
  .sm-space-p-b-half {
    padding-bottom: 50% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-half {
    margin-left: 50% !important;
  }
  .sm-space-p-l-half {
    padding-left: 50% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-half {
    margin-right: 50% !important;
  }
  .sm-space-p-r-half {
    padding-right: 50% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-half {
    margin-top: 50% !important;
    margin-bottom: 50% !important;
  }
  .sm-space-p-v-half {
    padding-top: 50% !important;
    padding-bottom: 50% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-half {
    margin-left: 50% !important;
    margin-right: 50% !important;
  }
  .sm-space-p-h-half {
    padding-left: 50% !important;
    padding-right: 50% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-t-three-quarter {
    margin-top: 75% !important;
  }
  .sm-space-p-t-three-quarter {
    padding-top: 75% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-b-three-quarter {
    margin-bottom: 75% !important;
  }
  .sm-space-p-b-three-quarter {
    padding-bottom: 75% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-l-three-quarter {
    margin-left: 75% !important;
  }
  .sm-space-p-l-three-quarter {
    padding-left: 75% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-r-three-quarter {
    margin-right: 75% !important;
  }
  .sm-space-p-r-three-quarter {
    padding-right: 75% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-v-three-quarter {
    margin-top: 75% !important;
    margin-bottom: 75% !important;
  }
  .sm-space-p-v-three-quarter {
    padding-top: 75% !important;
    padding-bottom: 75% !important;
  }
}
@media only screen and (max-width: 764px) {
  .sm-space-m-h-three-quarter {
    margin-left: 75% !important;
    margin-right: 75% !important;
  }
  .sm-space-p-h-three-quarter {
    padding-left: 75% !important;
    padding-right: 75% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-n {
    margin-top: 0 !important;
  }
  .md-space-p-t-n {
    padding-top: 0 !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-n {
    margin-bottom: 0 !important;
  }
  .md-space-p-b-n {
    padding-bottom: 0 !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-n {
    margin-left: 0 !important;
  }
  .md-space-p-l-n {
    padding-left: 0 !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-n {
    margin-right: 0 !important;
  }
  .md-space-p-r-n {
    padding-right: 0 !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-n {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .md-space-p-v-n {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-n {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .md-space-p-h-n {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-xs {
    margin-top: 4px !important;
  }
  .md-space-p-t-xs {
    padding-top: 4px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-xs {
    margin-bottom: 4px !important;
  }
  .md-space-p-b-xs {
    padding-bottom: 4px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-xs {
    margin-left: 4px !important;
  }
  .md-space-p-l-xs {
    padding-left: 4px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-xs {
    margin-right: 4px !important;
  }
  .md-space-p-r-xs {
    padding-right: 4px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-xs {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
  }
  .md-space-p-v-xs {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-xs {
    margin-left: 4px !important;
    margin-right: 4px !important;
  }
  .md-space-p-h-xs {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-s {
    margin-top: 8px !important;
  }
  .md-space-p-t-s {
    padding-top: 8px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-s {
    margin-bottom: 8px !important;
  }
  .md-space-p-b-s {
    padding-bottom: 8px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-s {
    margin-left: 8px !important;
  }
  .md-space-p-l-s {
    padding-left: 8px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-s {
    margin-right: 8px !important;
  }
  .md-space-p-r-s {
    padding-right: 8px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-s {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
  }
  .md-space-p-v-s {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-s {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }
  .md-space-p-h-s {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-m {
    margin-top: 16px !important;
  }
  .md-space-p-t-m {
    padding-top: 16px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-m {
    margin-bottom: 16px !important;
  }
  .md-space-p-b-m {
    padding-bottom: 16px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-m {
    margin-left: 16px !important;
  }
  .md-space-p-l-m {
    padding-left: 16px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-m {
    margin-right: 16px !important;
  }
  .md-space-p-r-m {
    padding-right: 16px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-m {
    margin-top: 16px !important;
    margin-bottom: 16px !important;
  }
  .md-space-p-v-m {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-m {
    margin-left: 16px !important;
    margin-right: 16px !important;
  }
  .md-space-p-h-m {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-l {
    margin-top: 24px !important;
  }
  .md-space-p-t-l {
    padding-top: 24px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-l {
    margin-bottom: 24px !important;
  }
  .md-space-p-b-l {
    padding-bottom: 24px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-l {
    margin-left: 24px !important;
  }
  .md-space-p-l-l {
    padding-left: 24px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-l {
    margin-right: 24px !important;
  }
  .md-space-p-r-l {
    padding-right: 24px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-l {
    margin-top: 24px !important;
    margin-bottom: 24px !important;
  }
  .md-space-p-v-l {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-l {
    margin-left: 24px !important;
    margin-right: 24px !important;
  }
  .md-space-p-h-l {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-xl {
    margin-top: 32px !important;
  }
  .md-space-p-t-xl {
    padding-top: 32px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-xl {
    margin-bottom: 32px !important;
  }
  .md-space-p-b-xl {
    padding-bottom: 32px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-xl {
    margin-left: 32px !important;
  }
  .md-space-p-l-xl {
    padding-left: 32px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-xl {
    margin-right: 32px !important;
  }
  .md-space-p-r-xl {
    padding-right: 32px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-xl {
    margin-top: 32px !important;
    margin-bottom: 32px !important;
  }
  .md-space-p-v-xl {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-xl {
    margin-left: 32px !important;
    margin-right: 32px !important;
  }
  .md-space-p-h-xl {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-xxl {
    margin-top: 64px !important;
  }
  .md-space-p-t-xxl {
    padding-top: 64px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-xxl {
    margin-bottom: 64px !important;
  }
  .md-space-p-b-xxl {
    padding-bottom: 64px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-xxl {
    margin-left: 64px !important;
  }
  .md-space-p-l-xxl {
    padding-left: 64px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-xxl {
    margin-right: 64px !important;
  }
  .md-space-p-r-xxl {
    padding-right: 64px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-xxl {
    margin-top: 64px !important;
    margin-bottom: 64px !important;
  }
  .md-space-p-v-xxl {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-xxl {
    margin-left: 64px !important;
    margin-right: 64px !important;
  }
  .md-space-p-h-xxl {
    padding-left: 64px !important;
    padding-right: 64px !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-quarter {
    margin-top: 25% !important;
  }
  .md-space-p-t-quarter {
    padding-top: 25% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-quarter {
    margin-bottom: 25% !important;
  }
  .md-space-p-b-quarter {
    padding-bottom: 25% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-quarter {
    margin-left: 25% !important;
  }
  .md-space-p-l-quarter {
    padding-left: 25% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-quarter {
    margin-right: 25% !important;
  }
  .md-space-p-r-quarter {
    padding-right: 25% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-quarter {
    margin-top: 25% !important;
    margin-bottom: 25% !important;
  }
  .md-space-p-v-quarter {
    padding-top: 25% !important;
    padding-bottom: 25% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-quarter {
    margin-left: 25% !important;
    margin-right: 25% !important;
  }
  .md-space-p-h-quarter {
    padding-left: 25% !important;
    padding-right: 25% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-half {
    margin-top: 50% !important;
  }
  .md-space-p-t-half {
    padding-top: 50% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-half {
    margin-bottom: 50% !important;
  }
  .md-space-p-b-half {
    padding-bottom: 50% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-half {
    margin-left: 50% !important;
  }
  .md-space-p-l-half {
    padding-left: 50% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-half {
    margin-right: 50% !important;
  }
  .md-space-p-r-half {
    padding-right: 50% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-half {
    margin-top: 50% !important;
    margin-bottom: 50% !important;
  }
  .md-space-p-v-half {
    padding-top: 50% !important;
    padding-bottom: 50% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-half {
    margin-left: 50% !important;
    margin-right: 50% !important;
  }
  .md-space-p-h-half {
    padding-left: 50% !important;
    padding-right: 50% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-t-three-quarter {
    margin-top: 75% !important;
  }
  .md-space-p-t-three-quarter {
    padding-top: 75% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-b-three-quarter {
    margin-bottom: 75% !important;
  }
  .md-space-p-b-three-quarter {
    padding-bottom: 75% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-l-three-quarter {
    margin-left: 75% !important;
  }
  .md-space-p-l-three-quarter {
    padding-left: 75% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-r-three-quarter {
    margin-right: 75% !important;
  }
  .md-space-p-r-three-quarter {
    padding-right: 75% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-v-three-quarter {
    margin-top: 75% !important;
    margin-bottom: 75% !important;
  }
  .md-space-p-v-three-quarter {
    padding-top: 75% !important;
    padding-bottom: 75% !important;
  }
}
@media only screen and (min-width: 765px) and (max-width: 1199px) {
  .md-space-m-h-three-quarter {
    margin-left: 75% !important;
    margin-right: 75% !important;
  }
  .md-space-p-h-three-quarter {
    padding-left: 75% !important;
    padding-right: 75% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-n {
    margin-top: 0 !important;
  }
  .lg-space-p-t-n {
    padding-top: 0 !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-n {
    margin-bottom: 0 !important;
  }
  .lg-space-p-b-n {
    padding-bottom: 0 !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-n {
    margin-left: 0 !important;
  }
  .lg-space-p-l-n {
    padding-left: 0 !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-n {
    margin-right: 0 !important;
  }
  .lg-space-p-r-n {
    padding-right: 0 !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-n {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .lg-space-p-v-n {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-n {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .lg-space-p-h-n {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-xs {
    margin-top: 4px !important;
  }
  .lg-space-p-t-xs {
    padding-top: 4px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-xs {
    margin-bottom: 4px !important;
  }
  .lg-space-p-b-xs {
    padding-bottom: 4px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-xs {
    margin-left: 4px !important;
  }
  .lg-space-p-l-xs {
    padding-left: 4px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-xs {
    margin-right: 4px !important;
  }
  .lg-space-p-r-xs {
    padding-right: 4px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-xs {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
  }
  .lg-space-p-v-xs {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-xs {
    margin-left: 4px !important;
    margin-right: 4px !important;
  }
  .lg-space-p-h-xs {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-s {
    margin-top: 8px !important;
  }
  .lg-space-p-t-s {
    padding-top: 8px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-s {
    margin-bottom: 8px !important;
  }
  .lg-space-p-b-s {
    padding-bottom: 8px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-s {
    margin-left: 8px !important;
  }
  .lg-space-p-l-s {
    padding-left: 8px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-s {
    margin-right: 8px !important;
  }
  .lg-space-p-r-s {
    padding-right: 8px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-s {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
  }
  .lg-space-p-v-s {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-s {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }
  .lg-space-p-h-s {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-m {
    margin-top: 16px !important;
  }
  .lg-space-p-t-m {
    padding-top: 16px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-m {
    margin-bottom: 16px !important;
  }
  .lg-space-p-b-m {
    padding-bottom: 16px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-m {
    margin-left: 16px !important;
  }
  .lg-space-p-l-m {
    padding-left: 16px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-m {
    margin-right: 16px !important;
  }
  .lg-space-p-r-m {
    padding-right: 16px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-m {
    margin-top: 16px !important;
    margin-bottom: 16px !important;
  }
  .lg-space-p-v-m {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-m {
    margin-left: 16px !important;
    margin-right: 16px !important;
  }
  .lg-space-p-h-m {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-l {
    margin-top: 24px !important;
  }
  .lg-space-p-t-l {
    padding-top: 24px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-l {
    margin-bottom: 24px !important;
  }
  .lg-space-p-b-l {
    padding-bottom: 24px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-l {
    margin-left: 24px !important;
  }
  .lg-space-p-l-l {
    padding-left: 24px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-l {
    margin-right: 24px !important;
  }
  .lg-space-p-r-l {
    padding-right: 24px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-l {
    margin-top: 24px !important;
    margin-bottom: 24px !important;
  }
  .lg-space-p-v-l {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-l {
    margin-left: 24px !important;
    margin-right: 24px !important;
  }
  .lg-space-p-h-l {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-xl {
    margin-top: 32px !important;
  }
  .lg-space-p-t-xl {
    padding-top: 32px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-xl {
    margin-bottom: 32px !important;
  }
  .lg-space-p-b-xl {
    padding-bottom: 32px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-xl {
    margin-left: 32px !important;
  }
  .lg-space-p-l-xl {
    padding-left: 32px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-xl {
    margin-right: 32px !important;
  }
  .lg-space-p-r-xl {
    padding-right: 32px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-xl {
    margin-top: 32px !important;
    margin-bottom: 32px !important;
  }
  .lg-space-p-v-xl {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-xl {
    margin-left: 32px !important;
    margin-right: 32px !important;
  }
  .lg-space-p-h-xl {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-xxl {
    margin-top: 64px !important;
  }
  .lg-space-p-t-xxl {
    padding-top: 64px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-xxl {
    margin-bottom: 64px !important;
  }
  .lg-space-p-b-xxl {
    padding-bottom: 64px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-xxl {
    margin-left: 64px !important;
  }
  .lg-space-p-l-xxl {
    padding-left: 64px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-xxl {
    margin-right: 64px !important;
  }
  .lg-space-p-r-xxl {
    padding-right: 64px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-xxl {
    margin-top: 64px !important;
    margin-bottom: 64px !important;
  }
  .lg-space-p-v-xxl {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-xxl {
    margin-left: 64px !important;
    margin-right: 64px !important;
  }
  .lg-space-p-h-xxl {
    padding-left: 64px !important;
    padding-right: 64px !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-quarter {
    margin-top: 25% !important;
  }
  .lg-space-p-t-quarter {
    padding-top: 25% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-quarter {
    margin-bottom: 25% !important;
  }
  .lg-space-p-b-quarter {
    padding-bottom: 25% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-quarter {
    margin-left: 25% !important;
  }
  .lg-space-p-l-quarter {
    padding-left: 25% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-quarter {
    margin-right: 25% !important;
  }
  .lg-space-p-r-quarter {
    padding-right: 25% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-quarter {
    margin-top: 25% !important;
    margin-bottom: 25% !important;
  }
  .lg-space-p-v-quarter {
    padding-top: 25% !important;
    padding-bottom: 25% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-quarter {
    margin-left: 25% !important;
    margin-right: 25% !important;
  }
  .lg-space-p-h-quarter {
    padding-left: 25% !important;
    padding-right: 25% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-half {
    margin-top: 50% !important;
  }
  .lg-space-p-t-half {
    padding-top: 50% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-half {
    margin-bottom: 50% !important;
  }
  .lg-space-p-b-half {
    padding-bottom: 50% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-half {
    margin-left: 50% !important;
  }
  .lg-space-p-l-half {
    padding-left: 50% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-half {
    margin-right: 50% !important;
  }
  .lg-space-p-r-half {
    padding-right: 50% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-half {
    margin-top: 50% !important;
    margin-bottom: 50% !important;
  }
  .lg-space-p-v-half {
    padding-top: 50% !important;
    padding-bottom: 50% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-half {
    margin-left: 50% !important;
    margin-right: 50% !important;
  }
  .lg-space-p-h-half {
    padding-left: 50% !important;
    padding-right: 50% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-t-three-quarter {
    margin-top: 75% !important;
  }
  .lg-space-p-t-three-quarter {
    padding-top: 75% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-b-three-quarter {
    margin-bottom: 75% !important;
  }
  .lg-space-p-b-three-quarter {
    padding-bottom: 75% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-l-three-quarter {
    margin-left: 75% !important;
  }
  .lg-space-p-l-three-quarter {
    padding-left: 75% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-r-three-quarter {
    margin-right: 75% !important;
  }
  .lg-space-p-r-three-quarter {
    padding-right: 75% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-v-three-quarter {
    margin-top: 75% !important;
    margin-bottom: 75% !important;
  }
  .lg-space-p-v-three-quarter {
    padding-top: 75% !important;
    padding-bottom: 75% !important;
  }
}
@media only screen and (min-width: 1200px) {
  .lg-space-m-h-three-quarter {
    margin-left: 75% !important;
    margin-right: 75% !important;
  }
  .lg-space-p-h-three-quarter {
    padding-left: 75% !important;
    padding-right: 75% !important;
  }
}
.static {
  position: static !important;
}

.relative {
  position: relative !important;
}

.absolute {
  position: absolute !important;
}

.fixed {
  position: fixed !important;
}

.is-hidden {
  display: none !important;
}

.opacity-10 {
  opacity: 0.1;
}

.opacity-50 {
  opacity: 0.5;
}

.opacity-60 {
  opacity: 0.6;
}

.opacity-80 {
  opacity: 0.8;
}

.visible {
  overflow: visible !important;
}

.visible-y {
  overflow-y: visible !important;
}

.visible-x {
  overflow-x: visible !important;
}

.text-left {
  text-align: left !important;
}

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

.text-justify {
  text-align: justify !important;
}

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

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

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

.text-truncate {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
}

.text-hint {
  font-size: 11px;
  line-height: 1.25;
  color: #808080;
}

.text-color-hint {
  color: #808080;
}

.text-accent {
  color: #679FBA !important;
}

.text-state {
  font-size: 13px;
  font-weight: bold;
  text-transform: uppercase;
  color: #555;
  font-family: "Open Sans", sans-serif;
}

.text-primary {
  color: #207da9 !important;
}

.text-secondary {
  color: rgb(90, 110, 140) !important;
}

.text-alert {
  color: #db2635 !important;
}

.text-warning {
  color: #fbbd14 !important;
}

.text-info {
  color: #666 !important;
}

.text-selectable.text-selectable--info {
  background-color: #849796;
  color: rgba(255, 255, 255, 0.87);
  padding: 2px 4px;
}

.text-highlight {
  font-size: 20px;
  line-height: 1.1;
  color: #666;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
}

.text-emphasis {
  font-size: 24px;
  line-height: 1.24;
  font-weight: normal;
  font-family: "Open Sans", sans-serif;
  color: #679FBA;
}

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

.text-grey {
  color: #686868;
}

.text-label-active {
  font-size: 11px;
  margin: 4px 0;
  color: rgba(0, 0, 0, 0.54);
}

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

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

.font-16 {
  font-size: 16px !important;
}

.align-self-stretch {
  align-self: stretch !important;
}

.is-processing {
  position: relative;
  display: inline-block;
}
.is-processing md-progress-circular {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 10;
}
.is-processing md-progress-circular[md-diameter="20px"] {
  margin-left: -10px;
  margin-top: -10px;
}
.is-processing md-icon {
  opacity: 0.5;
}

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

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

.u-width-40 {
  width: 40px !important;
}

.u-width-48 {
  width: 48px !important;
}

.u-context {
  position: relative !important;
}

.progress-block {
  position: relative;
}
.progress-block::before {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.3);
  z-index: 100;
}
.progress-block md-progress-circular {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -25px;
  margin-left: -25px;
}

.between-time .input-container--short {
  width: 44px;
  margin-left: 12px;
  margin-right: 12px;
}
.between-time .input-container--short > input {
  text-align: center;
}

.dt-backdrop {
  position: fixed !important;
  z-index: 99;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.sticky-fixed {
  position: fixed !important;
  overflow-y: auto !important;
}
.sticky-fixed .dt-thing-details__container {
  width: 375px;
}

.u-events-none {
  pointer-events: none;
}

.u-user-select {
  user-select: none;
}

dt-things-search-advanced {
  display: block;
}

.z-index-xl {
  z-index: 1000;
}

.u-width-auto {
  width: auto !important;
  max-width: none !important;
  min-width: none !important;
}

.is-focused {
  background-color: rgba(158, 158, 158, 0.2) !important;
}

@keyframes spin-animation {
  100% {
    transform: rotate(-360deg);
  }
}
.spinning {
  animation: spin-animation 1s linear infinite;
}

.no-3d-transform input {
  -webkit-transform: translate3d(0, 0, 0);
}

.sticky-below-header {
  position: -webkit-sticky;
  position: sticky;
  top: 60px;
}
@media (min-width: 960px) {
  .sticky-below-header {
    top: 0;
  }
}

.u-align-icon {
  margin-top: -2px;
}

.dt-animated.dt-fade-in {
  transition: opacity 0.3s ease-out;
}
.dt-animated.dt-fade-in.ng-enter {
  opacity: 0;
}
.dt-animated.dt-fade-in.ng-enter.ng-enter-active {
  opacity: 1;
}

/* Pop */
@keyframes effect-wobble-vertical {
  16.65% {
    transform: translateY(8px);
  }
  33.3% {
    transform: translateY(-6px);
  }
  49.95% {
    transform: translateY(4px);
  }
  66.6% {
    transform: translateY(-2px);
  }
  83.25% {
    transform: translateY(1px);
  }
  100% {
    transform: translateY(0);
  }
}
.effect-wobble-vertical {
  animation-name: effect-wobble-vertical;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: 1;
}

/*
 * Override default styles
*/
table.md-table.md-row-select td.md-cell:first-child, table.md-table.md-row-select th.md-column:first-child {
  padding: 8px 0 8px 12px;
}
table.md-table.md-row-select td.md-cell:nth-child(2), table.md-table.md-row-select th.md-column:nth-child(2) {
  padding: 8px 12px;
}
table.md-table:not(.md-row-select) td.md-cell:first-child, table.md-table:not(.md-row-select) th.md-column:first-child {
  padding: 8px 12px;
}
table.md-table td.md-cell:last-child,
table.md-table th.md-column:last-child {
  padding: 8px 12px 8px 0;
}
@media (max-width: 735px) {
  table.md-table td.last-on-mobile,
  table.md-table th.last-on-mobile {
    padding-right: 12px !important;
  }
}
table.md-table th.md-column md-icon {
  margin-right: 0 !important;
}
table.md-table td.md-cell {
  color: #15394C;
}

md-table-container.table-container {
  background-color: #fff;
}
md-table-container.table-container table.md-table tr.md-row-active td.md-cell {
  color: #15394C !important;
}
md-table-container.table-container table.md-table tr.md-row-active td.md-cell:first-child {
  padding-left: 9px;
  border-left: 3px solid rgba(255, 83, 49, 0.6784313725);
}
md-table-container.table-container table.md-table tr.md-row-active td.md-cell:first-child:before, md-table-container.table-container table.md-table tr.md-row-active td.md-cell:first-child:after {
  margin-left: -12px;
}
md-table-container.table-container table.md-table tr.md-row-active .md-off {
  opacity: 1;
}
md-table-container.table-container thead.md-head > tr.md-row {
  height: 44px;
}
md-table-container.table-container tr:focus,
md-table-container.table-container td:focus,
md-table-container.table-container th:focus {
  outline: 0;
}
md-table-container.table-container th,
md-table-container.table-container th.table__header,
md-table-container.table-container th.md-column {
  color: rgb(90, 110, 140);
  font-size: 11px;
  text-transform: uppercase;
  background: #fff;
  font-weight: 700;
  font-family: "Open Sans", sans-serif;
}
md-table-container.table-container th dt-radio-status svg path,
md-table-container.table-container th.table__header dt-radio-status svg path,
md-table-container.table-container th.md-column dt-radio-status svg path {
  fill: rgb(90, 110, 140);
}
md-table-container.table-container tr.row--success,
md-table-container.table-container td.cell--success {
  background-color: rgba(87, 128, 47, 0.2);
}
md-table-container.table-container tr.row--warning,
md-table-container.table-container td.cell--warning {
  background-color: rgba(207, 37, 43, 0.2);
}
md-table-container.table-container tr.row--warning .action-button .material-icons,
md-table-container.table-container td.cell--warning .action-button .material-icons {
  color: #cf252b;
}
md-table-container.table-container tr.row--warning .action-button md-icon path,
md-table-container.table-container td.cell--warning .action-button md-icon path {
  fill: #cf252b;
}
md-table-container.table-container .cell--right {
  text-align: right !important;
}
md-table-container.table-container .cell--quantity {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: rgb(90, 110, 140);
}
md-table-container.table-container .cell-text--secondary {
  font-size: 12px;
  color: rgb(90, 110, 140);
}
md-table-container.table-container .row--muted td {
  opacity: 0.4;
}
md-table-container.table-container .cell--muted {
  opacity: 0.5;
}
md-table-container.table-container th.column-width--xs {
  width: 1%;
}
md-table-container.table-container th.column-width--m {
  width: 30%;
}
md-table-container.table-container th.column-width--half {
  width: 50%;
}
md-table-container.table-container th.column-width--40 {
  width: 40px;
  min-width: 40px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--50 {
  width: 50px;
  min-width: 50px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--60 {
  width: 60px;
  min-width: 60px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--70 {
  width: 70px;
  min-width: 70px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--80 {
  width: 80px;
  min-width: 80px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--90 {
  width: 90px;
  min-width: 90px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--100 {
  width: 100px;
  min-width: 100px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--110 {
  width: 110px;
  min-width: 110px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--120 {
  width: 120px;
  min-width: 120px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--130 {
  width: 130px;
  min-width: 130px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--140 {
  width: 140px;
  min-width: 140px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--150 {
  width: 150px;
  min-width: 150px;
  box-sizing: border-box;
}
md-table-container.table-container th.column-width--160 {
  width: 160px;
  min-width: 160px;
  box-sizing: border-box;
}
md-table-container.table-container .action-button .material-icons {
  color: #207da9;
}
md-table-container.table-container .action-button[disabled] {
  opacity: 0.5;
}
md-table-container.table-container .action-button md-icon path {
  fill: #207da9;
}
md-table-container.table-container md-radio-button {
  display: inline;
}
md-table-container.table-container md-radio-button .md-off {
  opacity: 0.54;
}
md-table-container.table-container md-radio-button:focus {
  outline: none;
}
md-table-container.table-container th.column-width--s {
  width: 110px;
}
md-table-container.table-container.table--stripped tr:nth-child(even),
md-table-container.table-container.table--stripped tr:nth-child(even) td {
  background-color: #f5f5f5;
}
md-table-container.table-container .alert-icon {
  width: 18px;
  height: 16px;
  min-width: 18px;
  min-height: 16px;
}

table.md-table th.md-column md-icon.md-sort-icon {
  opacity: 0.5;
}

.dt-table__row-icon md-icon {
  color: #324249;
}

.table-pagination {
  background-color: #fff;
}
.table-pagination ._md-select-value > span:not(._md-select-icon) {
  text-align: center;
  padding-left: 10px;
}
.table-pagination ._md-select-value ._md-select-icon {
  width: auto;
}

.md-list--stripped .md-3-line:nth-child(even) {
  background-color: #e1f5fe;
}

/* ==========================================================================
   flexEmbed
   ========================================================================== */
/**
 * Flexible media embeds
 *
 * For use with media embeds – such as videos, slideshows, or even images –
 * that need to retain a specific aspect ratio but adapt to the width of their
 * containing element.
 *
 * Example HTML:
 *
 * <div class="flexEmbed flexEmbed--16by9">
 *     <iframe class="flexEmbed-item" src="…"></iframe>
 * </div>
 *
 * <div class="flexEmbed flexEmbed--16by9">
 *     [iframe|object|embed|img]
 * </div>
 *
 */
.flexEmbed {
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
  position: relative;
}

/**
 * The use of an explicit descendant class makes this component more flexible.
 * However, it will work automatically for iframes, embeds, and objects to
 * account for times when you cannot modify the attributes for 3rd party widget
 * code.
 */
.flexEmbed-item,
.flexEmbed iframe,
.flexEmbed embed,
.flexEmbed object {
  bottom: 0;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

/**
 * Modifier: 16:9 aspect ratio
 */
.flexEmbed--16by9 {
  padding-bottom: 56.25%;
}

/**
 * Modifier: 16:9 aspect ratio
 */
.flexEmbed--16by6 {
  padding-bottom: 36.25%;
}

/**
 * Modifier: 4:3 aspect ratio
 */
.flexEmbed--4by3 {
  padding-bottom: 75%;
}

/**
 * Gray scale color
 */
.flexEmbeb--grayScale iframe {
  filter: grayscale(100%);
}

.logo {
  height: 20px;
  font-family: "Open Sans", sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 20px;
  display: flex;
}
.logo__image {
  width: 82px;
  margin-right: 12px;
  display: flex;
}
.logo__image img {
  width: 100%;
  display: block;
  height: 20px;
}
@media (min-width: 736px) {
  .logo__image img {
    height: 24px;
  }
}
.logo__title {
  color: #ffffff;
}
@media (max-width: 735px) {
  .logo__title {
    display: none;
  }
}
@media (min-width: 736px) and (max-width: 959px) {
  .logo__title {
    display: none;
  }
}
@media (min-width: 736px) {
  .logo {
    height: 24px;
    font-size: 24px;
    line-height: 24px;
  }
}

.top-navbar {
  background-color: #324249;
}
.top-navbar__item {
  margin-left: 12px;
}
.top-navbar__item:first-child {
  margin-left: 0;
}
.top-navbar__tools {
  padding-right: 26px;
}
.top-navbar__tools-btn {
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  transition: color 0.3s ease-out;
}
.top-navbar__tools-btn:hover {
  color: rgba(255, 255, 255, 0.87) !important;
}
.top-navbar__tools-btn:focus {
  outline: none;
}
.top-navbar__tools-btn .material-icons {
  color: rgba(255, 255, 255, 0.6);
  transition: color 0.3s ease-out;
  margin-left: 4px;
}
.top-navbar__tools-btn .material-icons:hover {
  color: rgba(255, 255, 255, 0.87) !important;
}
.top-navbar__tools-btn .material-icons:focus {
  outline: none;
}
.top-navbar__tools-item {
  margin-left: 12px;
}
.top-navbar__tools-item:first-child {
  margin-left: 0;
}
.top-navbar__tools-btn .material-icons {
  color: rgba(255, 255, 255, 0.6);
  transition: color 0.3s ease-out;
  margin-left: 4px;
}
.top-navbar__tools-btn .material-icons:hover {
  color: rgba(255, 255, 255, 0.87) !important;
}
.top-navbar__tools-btn .material-icons:focus {
  outline: none;
}
.top-navbar__tools-btn {
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  transition: color 0.3s ease-out;
}
.top-navbar__tools-btn:hover {
  color: rgba(255, 255, 255, 0.87) !important;
}
.top-navbar__tools-btn:focus {
  outline: none;
}

.empty-state {
  max-width: 400px;
  margin: 0 auto;
  text-align: center;
  padding: 0 16px;
}
.empty-state__header {
  margin: 8px 0;
}
.empty-state__header .fa {
  color: #232d33;
}
.empty-state__content {
  margin: 8px 0;
}

dt-help-menu {
  width: 828px;
  display: flex;
  justify-content: flex-end;
}
dt-help-menu dt-application-help {
  display: block;
  width: 634px;
}
dt-help-menu dt-application-help .dtApplicationHelp__info .box-title {
  margin: 4px 0 24px 0;
  color: #7493a2;
}
dt-help-menu dt-application-help .dtApplicationHelp__info p {
  margin-bottom: 24px;
}
dt-help-menu dt-application-help .dtApplicationHelp__image {
  width: 210px;
  min-width: 210px;
  height: 210px;
  margin: 8px;
  background-color: #859796;
  overflow: hidden;
  border-radius: 50%;
  position: relative;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
}
dt-help-menu dt-application-help .dtApplicationHelp__image::before {
  content: "Illustration here";
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.31;
  color: #eaf9ff;
}

.box-rounded {
  width: 210px;
  min-width: 210px;
  height: 210px;
  margin: 8px;
  overflow: hidden;
  border-radius: 50%;
  position: relative;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
}
.box-rounded.box-rounded--grey {
  background-color: #859796;
  color: #fff;
}

@media (min-width: 736px) {
  .md-panel.dt-feedback-popup {
    width: 736px;
  }
}

.dt-feedback-form {
  display: flex;
  flex-direction: column;
}
@media (min-width: 736px) {
  .dt-feedback-form {
    flex-direction: row;
    justify-content: space-between;
  }
  .dt-feedback-form > * {
    width: 330px;
  }
}
.dt-feedback-form__screenshot {
  display: none;
}
@media (min-width: 736px) {
  .dt-feedback-form__screenshot {
    display: block;
  }
}

help-screenshot {
  display: block;
}

.dtHelp-screenshot__preview {
  cursor: pointer;
  padding: 1px;
  min-height: 160px;
  background-color: rgba(0, 0, 0, 0.12);
}
.dtHelp-screenshot__preview canvas {
  vertical-align: top;
}

.dtHelp-screenshot__preview-hint {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 15%;
  right: 15%;
  margin: -48px 0 0;
  padding: 20px 0;
  background-color: rgba(255, 255, 255, 0.6);
}
.dtHelp-screenshot__preview:hover .dtHelp-screenshot__preview-hint {
  background-color: rgba(255, 255, 255, 0.8);
}

.help-screenshot-content {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.4);
  user-select: none;
}
.help-screenshot-content.is-load {
  background-color: #808080;
}

.help-screenshot-rect {
  position: absolute;
}
.help-screenshot-content-hightlights .help-screenshot-rect:hover {
  background: rgba(58, 72, 195, 0.2) !important;
  outline: 2px solid rgba(58, 72, 195, 0.8);
  z-index: 1002;
}
.help-screenshot-content-hides .help-screenshot-rect:hover {
  background: rgba(0, 0, 0, 0) !important;
  outline: 2px solid rgba(58, 72, 195, 0.8);
  z-index: 1002;
}
.help-screenshot-content-hides .help-screenshot-rect {
  background: rgb(0, 0, 0) !important;
}
.help-screenshot-rect > .md-icon-button {
  position: absolute;
  top: -20px;
  right: -24px;
  z-index: 1003;
}
.help-screenshot-rect > .md-icon-button > .material-icons {
  background-color: #fff;
  transform: rotateZ(45deg);
  border-radius: 20px;
}

.help-screenshot-current-rect {
  position: absolute;
  background-color: rgba(255, 255, 255, 0.2);
}

.help-screenshot-navbar {
  text-transform: uppercase;
  position: fixed;
  padding: 10px 20px 10px 12px;
  top: 100px;
  left: 60%;
  z-index: 1005;
  background-color: #fff;
  box-shadow: 2px 3.5px 7px 0 rgba(0, 0, 0, 0.35);
  user-select: none;
  border-radius: 4px;
}
.help-screenshot-navbar .drag-handler {
  cursor: move;
  position: absolute;
  color: #b1b1b1 !important;
  top: 3px;
  right: -10px;
  margin: 0;
  padding: 0;
  width: 30px;
  height: 30px;
}
.help-screenshot-navbar .help-screenshot-navbar-button {
  text-transform: uppercase;
  font-weight: 600;
  min-height: 36px;
  line-height: 36px;
  display: inline-block;
  text-align: center;
  border-radius: 3px;
  margin: 0;
  padding: 0 12px;
  transition: background 0.2s ease;
  margin-right: 8px;
}
.help-screenshot-navbar .help-screenshot-navbar-button:last-of-type {
  margin: 0 0 0 16px;
}
.help-screenshot-navbar .help-screenshot-navbar-button > .material-icons {
  font-size: 16px;
  margin: 0 2px 0 0;
}
.help-screenshot-navbar .help-screenshot-navbar-button.is-active, .help-screenshot-navbar .help-screenshot-navbar-button:hover {
  background-color: #b3c2ce;
}

.help-screenshot-content-canvas {
  position: relative;
  cursor: crosshair;
}
.help-screenshot-content-canvas > canvas {
  position: absolute;
  top: 0;
  left: 0;
}

dt-content-header {
  background-color: transparent;
  display: flex;
  flex-direction: row;
  align-content: center;
  align-items: center;
  justify-content: flex-start;
  height: 50px;
  box-sizing: border-box;
  padding: 32px 10px 4px 16px;
  background-image: none !important;
  height: 90px;
  margin-left: 2px;
}
@media (max-width: 735px) {
  dt-content-header {
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 0;
  }
}
dt-content-header .md-icon-button {
  align-self: flex-start;
}
dt-content-header h3 {
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #15394C;
  margin: 0;
  margin-top: 2px;
  margin-left: 12px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
@media (max-width: 735px) {
  dt-content-header h3 {
    font-size: 15px;
    font-weight: 600;
  }
}
@media (max-width: 735px) {
  dt-content-header.with-tabs {
    height: 99px;
  }
}
dt-content-header .details-text {
  color: rgba(21, 57, 76, 0.75);
  margin-left: 12px;
  margin-top: 2px;
  font-size: 14px;
  font-weight: lighter;
}
dt-content-header .md-nav-bar {
  transform: translate(-30px, 1px);
}
@media (min-width: 736px) {
  dt-content-header .md-nav-bar {
    transform: translate(-30px, 14px);
  }
}
dt-content-header .md-nav-bar .md-button.md-unselected {
  color: rgba(255, 255, 255, 0.7);
}
dt-content-header .md-nav-bar .md-button.md-active {
  color: #fff;
}
dt-content-header .md-nav-bar md-nav-ink-bar {
  background: #fff;
}

.highcharts-container {
  font-family: "Open Sans", sans-serif;
  color: #15394C;
  width: 100% !important;
  height: 100% !important;
}
.highcharts-plot-background {
  fill: rgb(249, 251, 254);
}
.highcharts-white-plot-band {
  fill: white;
  fill-opacity: 1;
}
.highcharts-arearange-series .highcharts-graph {
  stroke: none !important;
}
.highcharts-arearange-series .highcharts-area {
  fill-opacity: 0.3;
}
.highcharts-color-0 {
  fill: rgba(21, 57, 76, 0.9);
  stroke: rgba(172.4117647059, 185.1176470588, 191.8235294118, 0.96);
  color: rgba(21, 57, 76, 0.9);
}
.highcharts-color-0 .highcharts-graph {
  stroke: rgba(21, 57, 76, 0.9);
}
.highcharts-color-1 {
  fill: rgba(102, 158, 193, 0.9);
  stroke: rgba(201, 220.7647058824, 233.1176470588, 0.96);
  color: rgba(102, 158, 193, 0.9);
}
.highcharts-color-1 .highcharts-graph {
  stroke: rgba(102, 158, 193, 0.9);
}
.highcharts-color-2 {
  fill: rgba(127, 83, 75, 0.9);
  stroke: rgba(209.8235294118, 194.2941176471, 191.4705882353, 0.96);
  color: rgba(127, 83, 75, 0.9);
}
.highcharts-color-2 .highcharts-graph {
  stroke: rgba(127, 83, 75, 0.9);
}
.highcharts-color-3 {
  fill: rgba(90, 110, 140, 0.9);
  stroke: rgba(196.7647058824, 203.8235294118, 214.4117647059, 0.96);
  color: rgba(90, 110, 140, 0.9);
}
.highcharts-color-3 .highcharts-graph {
  stroke: rgba(90, 110, 140, 0.9);
}
.highcharts-color-4 {
  fill: #884f8d;
  stroke: rgb(207.4, 184.6, 209.4);
  color: #884f8d;
}
.highcharts-color-4 .highcharts-graph {
  stroke: #884f8d;
}
.highcharts-color-5 {
  fill: #97543a;
  stroke: rgb(213.4, 186.6, 176.2);
  color: #97543a;
}
.highcharts-color-5 .highcharts-graph {
  stroke: #97543a;
}
.highcharts-color-6 {
  fill: #4a7f52;
  stroke: rgb(182.6, 203.8, 185.8);
  color: #4a7f52;
}
.highcharts-color-6 .highcharts-graph {
  stroke: #4a7f52;
}
.highcharts-color-7 {
  fill: #b74c5f;
  stroke: rgb(226.2, 183.4, 191);
  color: #b74c5f;
}
.highcharts-color-7 .highcharts-graph {
  stroke: #b74c5f;
}
.highcharts-color-8 {
  fill: rgba(21, 57, 76, 0.9);
  stroke: rgba(172.4117647059, 185.1176470588, 191.8235294118, 0.96);
  color: rgba(21, 57, 76, 0.9);
}
.highcharts-color-8 .highcharts-graph {
  stroke: rgba(21, 57, 76, 0.9);
}
.highcharts-color-9 {
  fill: rgba(102, 158, 193, 0.9);
  stroke: rgba(201, 220.7647058824, 233.1176470588, 0.96);
  color: rgba(102, 158, 193, 0.9);
}
.highcharts-color-9 .highcharts-graph {
  stroke: rgba(102, 158, 193, 0.9);
}
.highcharts-color-10 {
  fill: rgba(127, 83, 75, 0.9);
  stroke: rgba(209.8235294118, 194.2941176471, 191.4705882353, 0.96);
  color: rgba(127, 83, 75, 0.9);
}
.highcharts-color-10 .highcharts-graph {
  stroke: rgba(127, 83, 75, 0.9);
}
.highcharts-color-11 {
  fill: rgba(90, 110, 140, 0.9);
  stroke: rgba(196.7647058824, 203.8235294118, 214.4117647059, 0.96);
  color: rgba(90, 110, 140, 0.9);
}
.highcharts-color-11 .highcharts-graph {
  stroke: rgba(90, 110, 140, 0.9);
}
.highcharts-color-12 {
  fill: #884f8d;
  stroke: rgb(207.4, 184.6, 209.4);
  color: #884f8d;
}
.highcharts-color-12 .highcharts-graph {
  stroke: #884f8d;
}
.highcharts-color-13 {
  fill: #97543a;
  stroke: rgb(213.4, 186.6, 176.2);
  color: #97543a;
}
.highcharts-color-13 .highcharts-graph {
  stroke: #97543a;
}
.highcharts-color-14 {
  fill: #4a7f52;
  stroke: rgb(182.6, 203.8, 185.8);
  color: #4a7f52;
}
.highcharts-color-14 .highcharts-graph {
  stroke: #4a7f52;
}
.highcharts-color-15 {
  fill: #b74c5f;
  stroke: rgb(226.2, 183.4, 191);
  color: #b74c5f;
}
.highcharts-color-15 .highcharts-graph {
  stroke: #b74c5f;
}
.highcharts-color-16 {
  fill: #71c329;
  stroke: rgb(198.2, 231, 169.4);
  color: #71c329;
}
.highcharts-color-16 .highcharts-graph {
  stroke: #71c329;
}
.highcharts-legend-item .highcharts-graph {
  stroke-width: 3px !important;
  stroke-linecap: butt;
}
.highcharts-legend-item text {
  font-size: 0.95em;
  color: rgb(90, 110, 140);
}
.highcharts-legend-nav-active {
  fill: rgba(21, 57, 76, 0.7);
}
.highcharts-tick {
  stroke: rgba(90, 110, 140, 0.5);
}
.highcharts-axis-line {
  stroke: rgba(90, 110, 140, 0);
}
.highcharts-axis-labels {
  font-family: "Open Sans", sans-serif;
  font-weight: bold;
  color: rgb(90, 110, 140);
  fill: rgb(90, 110, 140);
}
.highcharts-yaxis-labels {
  font-family: "Open Sans", sans-serif;
  font-weight: bold;
  color: rgb(90, 110, 140);
  fill: rgb(90, 110, 140);
}
.highcharts-xaxis-labels {
  fill: rgba(21, 57, 76, 0.8);
}
.highcharts-xaxis-labels tspan {
  fill: #15394c;
  font-size: 0.95em;
}
.highcharts-xaxis-grid .highcharts-grid-line {
  stroke: transparent;
}
.highcharts-xaxis-grid .highcharts-tick {
  stroke: rgb(90, 110, 140);
}
.highcharts-column-series rect.highcharts-point {
  stroke-width: 0;
}
.highcharts-series.faded-series {
  opacity: 0.4;
}
.highcharts-markers.faded-series {
  opacity: 0;
}
.highcharts-tooltip-container {
  z-index: 101 !important;
}
.highcharts-tooltip-box, .highcharts-label-box {
  fill: #3e4a4f !important;
  fill-opacity: 0.85 !important;
  stroke-width: 0 !important;
}
.highcharts-tooltip {
  filter: none !important;
  transition: none;
}
.highcharts-tooltip text {
  fill: white;
}
.highcharts-no-data-box {
  color: rgb(90, 110, 140);
}
.highcharts-custom-tooltip {
  fill: #17384c;
  stroke: #17384c;
}
.highcharts-selection-marker {
  fill: rgba(103, 159, 186, 0.5);
}
.highcharts-crosshair {
  z-index: 10;
  stroke: rgba(90, 110, 140, 0.5);
}
.highcharts-scrollbar-thumb {
  fill: #679FBA;
  stroke: #679FBA;
  stroke-width: 1;
  rx: 2;
  ry: 2;
}
.highcharts-scrollbar-button {
  fill: #17384c;
  stroke-width: 0;
  x: 0;
  rx: 2;
  ry: 2;
}
g:last-child .highcharts-scrollbar-button {
  x: -1;
}
.highcharts-scrollbar-arrow {
  fill: #fff;
  transform: translate(-2px, -2px) scale(1.2);
  stroke-linejoin: round;
}
.highcharts-scrollbar-rifles {
  stroke: none;
}
.highcharts-scrollbar-track {
  fill: rgb(245, 247, 250);
  stroke-width: 0;
  rx: 7;
  ry: 7;
}

.highcharts-reset-zoom {
  display: none;
  fill: none;
  stroke: none;
  cursor: default;
  rx: 2;
  ry: 2;
}
.highcharts-reset-zoom text {
  fill: #207da9;
  font-weight: bold;
  text-transform: uppercase;
}
.highcharts-reset-zoom text:hover {
  fill: rgb(25.6, 100, 135.2);
}
.highcharts-reset-zoom:hover {
  fill: rgba(25.6, 100, 135.2, 0.1);
}

.highcharts-yaxis-grid .highcharts-grid-line {
  stroke-width: 0;
}

.highcharts-container.multi-series-chart .highcharts-yaxis-grid.spacer-series {
  display: none;
}
.highcharts-container.multi-series-chart .highcharts-grid-line {
  stroke-width: 1px;
}
.highcharts-container.multi-series-chart .highcharts-plot-band:not(.highcharts-plot-band--missing-data) {
  fill: white;
}
.highcharts-container.multi-series-chart .highcharts-missing-data-label {
  top: 0px !important;
  left: 65px !important;
}

.chart--proximity .highcharts-yaxis-labels, .highcharts-xrange-series .highcharts-yaxis-labels {
  font-size: 12px;
  text-transform: uppercase;
}
.chart--proximity .highcharts-point, .highcharts-xrange-series .highcharts-point {
  stroke-width: 0;
  border-radius: 1px;
}

.chart--motion .highcharts-yaxis-labels, .highcharts-xrange-series .highcharts-yaxis-labels {
  font-size: 12px;
}
.chart--motion .highcharts-point, .highcharts-xrange-series .highcharts-point {
  stroke-width: 0;
  border-radius: 1px;
}

.chart--temperature .highcharts-scrollbar {
  transform: translate(50px, 225px);
}
.chart--temperature .highcharts-yaxis-labels {
  text-align: right;
}
.chart--temperature .highcharts-point {
  stroke-width: 0;
}
.chart--temperature .highcharts-point-hover {
  stroke-width: 1;
}

.chart--connectivity .highcharts-background {
  fill: transparent;
}

.chart--proximity-advanced .highcharts-yaxis .highcharts-axis-title,
.chart--state-based-advanced .highcharts-yaxis .highcharts-axis-title,
.chart--proximityCounter .highcharts-yaxis .highcharts-axis-title,
.chart--touchCounter .highcharts-yaxis .highcharts-axis-title {
  font-family: "Open Sans", sans-serif;
  font-weight: bold;
  fill: rgb(90, 110, 140);
  font-size: 11px;
}
.chart--proximity-advanced .highcharts-yaxis-labels,
.chart--state-based-advanced .highcharts-yaxis-labels,
.chart--proximityCounter .highcharts-yaxis-labels,
.chart--touchCounter .highcharts-yaxis-labels {
  transform: translate(10px, 0);
}

.aux-proximity-chart__message {
  display: none;
  height: 226px;
  align-items: center;
}
.aux-proximity-chart__message-box {
  box-sizing: border-box;
  flex-grow: 1;
  height: 162px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f0f5f7;
  color: #4e6370;
  font-size: 12px;
  font-weight: 600;
  padding: 16px;
  text-align: center;
}
.aux-proximity-chart.aux-proximity-chart--data-overload .aux-proximity-chart__message {
  display: flex;
}
.aux-proximity-chart.aux-proximity-chart--data-overload .aux-proximity-chart__chart {
  display: none;
}

.state-based-chart {
  position: relative;
}
.state-based-chart__message {
  display: none;
  height: 226px;
  align-items: center;
}
.state-based-chart__message-box {
  box-sizing: border-box;
  flex-grow: 1;
  position: absolute;
  top: 38px;
  left: 38px;
  bottom: 38px;
  right: 0;
  border-radius: 6px;
  background-color: rgb(246, 248, 250);
  border: 1px dashed rgb(218, 220, 232);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #4e6370;
  font-size: 12px;
  font-weight: 600;
  padding: 16px;
  text-align: center;
}
.state-based-chart.state-based-chart--data-overload .state-based-chart__message {
  display: flex;
}
.state-based-chart.state-based-chart--data-overload .state-based-chart__chart {
  display: none;
}

#hatch-left rect {
  fill: #fff;
}

#hatch-left path {
  stroke: rgba(207, 37, 43, 0.15);
  stroke-width: 1px;
}

.highcharts-plot-band--missing-data {
  fill: url(#hatch-left) rgb(245.5983606557, 202.4016393443, 203.9262295082);
  fill-opacity: 1;
}
.highcharts-plot-band--missing-data:hover {
  fill: url(#hatch-left) rgb(244.0516393443, 193.7483606557, 195.5237704918);
}

.highcharts-plot-band--boost {
  fill: #FF9615;
  fill-opacity: 0.2;
}

.highcharts-plot-band--ethernet {
  fill: rgb(90, 110, 140);
  fill-opacity: 0.2;
}

.highcharts-plot-band--incomplete-data {
  fill: #FF9615;
  fill-opacity: 0.25;
}
.highcharts-plot-band--incomplete-data:hover {
  fill-opacity: 0.3;
}

.highcharts-missing-data-label {
  color: #cf252b;
  background: #fff;
  opacity: 0.9;
  font-weight: bold;
  font-family: "Open Sans", sans-serif;
  display: block;
  border: 1px solid rgba(207, 37, 43, 0.3);
  border-radius: 6px;
  padding: 2px 8px;
}

.highcharts-trigger-delay-label {
  background: #FBFBFD;
  font-size: 11px;
  font-weight: 600;
  color: #906B62;
  font-weight: bold;
  font-family: "Open Sans", sans-serif;
  display: block;
  border: 1px solid rgba(144, 107, 98, 0.3);
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 12px;
}

.highcharts-boost-mode-label {
  font-weight: bold;
  background: #fff;
  padding: 0 4px 2px 20px;
  border-radius: 2px;
  color: #17384c;
  font-family: "Open Sans", sans-serif;
  display: block;
}
.highcharts-boost-mode-label::before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  border-radius: 50%;
  background-color: rgba(251, 189, 20, 0.6);
  margin-left: -18px;
  margin-top: 3px;
}

.highcharts-ethernet-label {
  font-weight: bold;
  color: #17384c;
  font-family: "Open Sans", sans-serif;
  display: block;
  opacity: 0.8;
  border-radius: 6px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  padding: 2px 8px;
  background: #fff;
}
.highcharts-ethernet-label img {
  width: 10px;
  margin-right: 4px;
}

.highcharts-ccon-tooltip {
  font-weight: bold;
  color: #17384c;
  font-family: "Open Sans", sans-serif;
}
.highcharts-ccon-tooltip .cellular-strength {
  font-size: 14px;
  margin-left: 4px;
  margin-right: 4px;
}

.graph-spacer-series-workaround {
  display: none;
}

.sensor-group {
  margin: 0 0 24px 0;
}
.sensor-group__caption {
  border-bottom: 2px solid #b1baba;
}
.sensor-group__list {
  margin: 0;
  padding-left: 0;
  list-style-type: none;
}
.sensor-group__list > li {
  margin: 0;
  padding: 8px 0;
  border-bottom: 1px solid #f0f2f3;
}
.sensor-group__list md-checkbox {
  width: 100%;
}
.sensor-group__list md-checkbox .md-label {
  margin-left: 0;
  padding-left: 30px;
  width: 100%;
  font-size: 13px;
  font-family: "Open Sans", sans-serif;
}

.identify-dialog-content {
  background-color: #EFF1F5;
  border-bottom: 1px solid rgb(218, 220, 232);
}

.sensor-identification-progress {
  position: relative;
  margin-bottom: 20px;
  height: 158px;
  width: 158px;
  margin: 0 auto;
  transform-style: flat;
  animation: sensor-down-animation 3.5s infinite;
  animation-delay: 0.5s;
}
.sensor-identification-progress.ng-animate {
  animation: none 0s;
}
@keyframes sensor-down-animation {
  30% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(3px);
  }
  65% {
    transform: translateY(0);
  }
}
.sensor-identification-progress .touch-animation {
  position: absolute;
  width: 42px;
  height: 42px;
  background-color: rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  left: 50%;
  top: 49%;
  margin: -21px 0 0 -21px;
  transform: scale(1) translateY(-40px) rotateX(60deg) rotateY(0deg) rotateZ(-45deg) translate3d(0, 0, 100px);
  opacity: 0;
  box-shadow: 0 0 0 0 rgb(0, 0, 0);
  animation: touch-press-animation 3.5s infinite;
  animation-delay: 0.5s;
}
.sensor-identification-progress .touch-animation.ng-animate {
  animation: none 0s;
}
@keyframes touch-press-animation {
  0% {
    transform: scale(1) translateY(-40px) rotateX(60deg) rotateY(0deg) rotateZ(-45deg);
    opacity: 0;
  }
  30% {
    background-color: rgba(0, 0, 0, 0.15);
    transform: scale(1.05) translateY(0) rotateX(60deg) rotateY(0deg) rotateZ(-45deg);
    opacity: 1;
  }
  40% {
    transform: scale(1.1) translateY(0) rotateX(60deg) rotateY(0deg) rotateZ(-45deg);
    background-color: rgba(0, 0, 0, 0.25);
  }
  60% {
    transform: scale(1.1) translateY(0) rotateX(60deg) rotateY(0deg) rotateZ(-45deg);
    opacity: 1;
  }
  95% {
    background-color: rgba(0, 0, 0, 0.15);
    transform: scale(1.05) translateY(0px) rotateX(60deg) rotateY(0deg) rotateZ(-45deg);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    opacity: 0;
  }
}
.sensor-identification-progress .event-animation {
  position: absolute;
  width: 60px;
  height: 60px;
  background-color: rgba(0, 0, 0, 0);
  border-radius: 50%;
  left: 50%;
  top: -35px;
  margin: -30px 0 0 -30px;
  transform: scale(1) rotateX(60deg) rotateY(0deg) rotateZ(-45deg) translateZ(-140px);
  box-shadow: 0 0 0 0 rgb(0, 0, 0);
  animation: event-pulse-animation 3.5s infinite;
  animation-delay: 0.5s;
}
.sensor-identification-progress .event-animation.ng-animate {
  animation: none 0s;
}
@keyframes event-pulse-animation {
  0% {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  35% {
    box-shadow: 0 0 0 0px rgba(248, 150, 49, 0.8);
  }
  80% {
    box-shadow: 0 0 0 60px rgba(248, 150, 49, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
}
.sensor-identification-progress__image {
  position: absolute;
  width: 150px;
  height: 150px;
  display: block;
  left: 50%;
  top: 50%;
  margin: -75px 0 0 -75px;
  transform: translateZ(-20px);
}

.sensor-identification-label {
  font-size: 16px;
  color: #17384c;
  text-align: center;
  margin-top: -12px;
  opacity: 0.7;
  margin-bottom: 24px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.sensor-identification-scope {
  display: flex;
  justify-content: center;
  align-items: baseline;
}

.sensor-identification-tip {
  margin-top: 20px;
}
.sensor-identification-tip .alert-box {
  margin-bottom: 0;
}
.sensor-identification-tip .alert-box__icon {
  display: none;
}
.sensor-identification-tip__image {
  display: block;
  margin: -32px auto -24px;
  width: 256px;
}

.identification-failed__title {
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  color: #cf252b;
  font-weight: 700;
  text-align: center;
}

.sensor-identification-too-many p {
  text-align: center;
}
.sensor-identification-too-many {
  color: #cf252b;
}

.kinda-input-container {
  padding: 0 2px;
}
.kinda-input-container__label {
  display: block;
  color: rgba(21, 57, 76, 0.75);
  font-size: 12px;
  margin-bottom: 4px;
}
.kinda-input-container__value {
  font-size: 15px;
  padding: 0 2px 0 0;
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;
}
dt-copyable-input.wrap-value .kinda-input-container__value {
  display: flex;
  align-items: center;
}
dt-copyable-input.wrap-value .kinda-input-container__value a {
  flex-shrink: 0;
}
.kinda-input-container.kinda-input-container--battery md-icon {
  vertical-align: bottom;
  color: #17384c !important;
}
.kinda-input-container.kinda-input-container--battery .kinda-input-container__value {
  line-height: 24px;
  color: rgb(90, 110, 140);
  font-weight: bold;
}
.kinda-input-container.kinda-input-container--battery .kinda-input-container__hint {
  margin-left: 8px;
  color: #17384c;
  font-weight: normal;
}

.md-dark-theme .kinda-input-container__label {
  color: #fff;
}

.kinda-disabled-link {
  color: #737678;
}
.kinda-disabled-link .material-icons {
  color: rgba(0, 0, 0, 0.38);
}

.project-link {
  flex: 1 0 45%;
  margin: 0 0 16px 16px;
  min-width: 280px;
}
.project-links {
  margin-left: -16px;
  flex-wrap: wrap;
}
.project-link__container {
  display: flex;
  align-items: center;
  border-radius: 2px;
  background-color: rgba(87, 109, 123, 0.2);
  margin-bottom: 12px;
}
.project-link__container:hover, .project-link__container:focus {
  background-color: #f0f2f3;
}
.project-link__value-container {
  background-color: rgba(255, 255, 255, 0.5);
  padding: 9px 24px;
}
.project-link__value {
  font-family: "Open Sans", sans-serif;
  font-size: 32px;
  font-weight: bold;
  color: rgb(90, 110, 140);
}
.project-link__label-container {
  padding: 16px;
}
.project-link__label {
  font-size: 12px;
  color: #697878;
  text-transform: uppercase;
}

.sensor-icon {
  position: relative;
  width: 48px;
  height: 48px;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: inset 0 -1px 2px -1px rgba(50, 50, 93, 0.4), 0 3px 8px -1px rgba(50, 50, 93, 0.35), 0 1px 3px -1px rgba(20, 20, 40, 0.4);
  z-index: 2;
}
@media (min-width: 736px) {
  .sensor-icon {
    width: 64px;
    height: 64px;
  }
}
.sensor-icon::before {
  display: block;
  content: "";
  background-color: #FF5331;
  width: 4px;
  height: 4px;
  position: relative;
  top: 4px;
  left: 4px;
  border-radius: 50%;
}
@media (min-width: 736px) {
  .sensor-icon::before {
    width: 5px;
    height: 5px;
    top: 5px;
    left: 5px;
  }
}
.sensor-icon md-icon {
  position: absolute;
  right: 2px;
  bottom: 5px;
}
@media (min-width: 736px) {
  .sensor-icon md-icon {
    bottom: 7px;
    right: 4px;
    min-width: 32px;
    min-height: 32px;
  }
}
.sensor-icon md-icon[md-svg-icon=temperature] {
  right: 0;
}

.sensor-icon-header {
  position: relative;
  width: 32px;
  height: 32px;
  background-color: #fff;
  border-radius: 3px;
  z-index: 2;
  margin-top: -4px;
  margin-left: 2px;
  margin-right: 14px;
}
@media (max-width: 735px) {
  .sensor-icon-header {
    display: none;
  }
}
.sensor-icon-header::before {
  display: block;
  content: "";
  background-color: #FF5331;
  width: 4px;
  height: 4px;
  position: relative;
  top: 3px;
  left: 3px;
  border-radius: 50%;
}

.ripple {
  position: relative;
  transform: translate3d(0, 0, 0);
}
.ripple::after, .ripple::before {
  content: "";
  display: block;
  position: absolute;
  width: 24px;
  height: 24px;
  margin-top: -12px;
  margin-left: -10px;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  pointer-events: none;
  background-color: rgba(248, 150, 49, 0);
  background-blend-mode: multiply;
  box-sizing: border-box;
  transform-origin: center;
  transition: 0.1s all;
}
.ripple--running::after, .ripple--running::before, .ripple--repeat::after, .ripple--repeat::before {
  animation-name: effect-water-ripple;
  animation-timing-function: cubic-bezier(0, 0, 0.16, 1.01);
  animation-duration: 3000ms;
}
.ripple--running::before, .ripple--repeat::before {
  animation-delay: 500ms;
}
.ripple--running .sensor-icon, .ripple--repeat .sensor-icon {
  animation-name: effect-press-down;
  animation-timing-function: ease-in-out;
  animation-duration: 500ms;
}
.ripple--repeat::before, .ripple--repeat::after {
  animation-name: effect-water-ripple--repeat;
}
.ripple--repeat .sensor-icon {
  animation-name: effect-press-down--repeat;
}
.ripple.sensor-state__icon::after, .ripple.sensor-state__icon::before {
  width: 48px;
  height: 48px;
  margin-top: -24px;
  margin-left: -24px;
  border: 1px solid rgba(248, 150, 49, 0.01);
}

/* Water ripples */
@keyframes effect-water-ripple {
  0% {
    background-color: rgba(248, 150, 49, 0.7);
    border-width: 16px;
    border-color: rgba(248, 150, 49, 0.7);
  }
  50% {
    border-width: 1px;
    border-color: rgba(248, 150, 49, 0.01);
  }
  100% {
    transform: scale(3);
  }
}
@keyframes effect-water-ripple--repeat { /* Hack to make animation retrigger when touch events are < 3000ms (the duration) */
  0% {
    background-color: rgba(248, 150, 49, 0.7);
    border-width: 16px;
    border-color: rgba(248, 150, 49, 0.7);
  }
  50% {
    border-width: 1px;
    border-color: rgba(248, 150, 49, 0.01);
  }
  100% {
    transform: scale(3);
  }
}
@keyframes effect-press-down {
  0% {
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5), inset 0 2px 2px 0 rgba(90, 110, 140, 0.1);
    transform: scale(0.96);
  }
}
@keyframes effect-press-down--repeat {
  0% {
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5), inset 0 2px 2px 0 rgba(90, 110, 140, 0.1);
    transform: scale(0.96);
  }
}
.search-panel {
  display: flex;
  flex-direction: column;
}
@media (min-width: 736px) {
  .search-panel {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
  }
}
.search-panel .identify-touch {
  margin-right: 14px;
  height: 38px;
}
.search-panel .identify-touch.side-nav-open {
  flex-grow: 1;
  margin: 0 0 12px 0;
}
@media (max-width: 735px) {
  .search-panel .identify-touch {
    margin: 0 0 12px 0;
  }
}

.search-toolbar md-icon {
  fill: currentColor !important;
}

.range-picker__header {
  padding: 18px 18px 8px 18px;
  display: flex;
  justify-content: space-between;
  background-color: rgb(246, 248, 250);
}
.range-picker__header .date-and-time {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.range-picker__header .date-and-time .clock-input {
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 5px;
  font-family: "Open Sans", sans-serif;
  padding: 2px 4px;
  color: #15394C;
}
.range-picker__header .date-and-time .clock-input:focus {
  outline: 1px solid rgba(105, 180, 254, 0.5);
}
.range-picker__header .date-container {
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  margin-left: 0;
  padding: 5px 12px;
  border-radius: 5px;
  font-weight: 600;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
  transition: 0.2s all;
}
.range-picker__header .date-container__selected {
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 3px rgba(105, 180, 254, 0.5), 0px 0px 0px 1px rgba(60, 66, 88, 0.14), 0px 3px 6px 0px rgba(60, 66, 88, 0.12);
}
.range-picker__header .date-container__selected:hover {
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 3px rgba(105, 180, 254, 0.5), 0px 0px 0px 1px rgba(60, 66, 88, 0.14), 0px 3px 6px 0px rgba(60, 66, 88, 0.12) !important;
}
.range-picker__header .date-container .date-input {
  width: 30px;
  font-weight: 600;
  opacity: 0.9;
  text-align: center;
  appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
  outline: 0;
  border: 0;
}
.range-picker__header .date-container .date-input--year {
  width: 40px;
}
.range-picker__header .date-container .date-separator {
  opacity: 0.5;
  margin-right: 3px;
}
.range-picker__apply {
  padding: 16px;
  display: flex;
  justify-content: space-between;
  background-color: rgb(246, 248, 250);
  border-top: 1px solid rgba(218, 220, 232, 0.8);
}
.range-picker__apply .icon-button {
  margin-left: 0;
  width: 100%;
}
.range-picker .between-date-element span {
  background-color: #f6f8fa;
  font-weight: 600;
  color: #15394C;
}
.range-picker .md-calendar-selected-date .md-calendar-date-selection-indicator {
  background-color: white;
}
.range-picker .md-calendar-scroll-mask {
  opacity: 0;
}
.range-picker .md-calendar-scroll-mask.loaded {
  transition: 0.2s ease opacity;
  opacity: 1;
}
.range-picker .active-date-element span {
  background-color: #f6f8fa !important;
}
.range-picker .active-date-element.start span {
  box-shadow: 0 0 0 1px #dadce8, inset 4px 0 0 0 rgba(62, 74, 79, 0.8);
}
.range-picker .active-date-element.end span {
  box-shadow: 0 0 0 1px #dadce8, inset -4px 0 0 0 rgba(62, 74, 79, 0.8);
}
.range-picker .active-date-element.start.end span {
  box-shadow: 0 0 0 1px #dadce8, inset 4px 0 0 0 rgba(62, 74, 79, 0.8), inset -4px 0 0 0 rgba(62, 74, 79, 0.8);
}
.range-picker .md-calendar-scroll-container {
  height: 320px;
}
.range-picker .md-calendar-date .md-calendar-date-selection-indicator {
  color: #15394C !important;
}
.range-picker .md-calendar-date.md-focus .md-calendar-date-selection-indicator {
  background: none;
}

.extended-storage-modal {
  width: 560px;
  max-width: 100%;
  border: none;
  color: #15394C;
}
.extended-storage-modal__header {
  display: flex;
  flex-direction: row;
  align-items: center;
  background-color: rgba(239, 241, 245, 0.5);
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
  padding: 30px 50px;
}
@media (max-width: 735px) {
  .extended-storage-modal__header {
    flex-direction: column-reverse;
    padding: 20px 30px;
    align-items: flex-start;
  }
}
.extended-storage-modal__header .years-callout {
  display: flex;
  flex-direction: column;
  padding: 24px 16px;
  margin-right: 30px;
  align-items: center;
  border: 1px solid #5BBF71;
  background-color: #F2FDF6;
  border-radius: 10px;
  box-shadow: 0 6px 8px -4px rgba(63, 132, 78, 0.2);
}
@media (max-width: 735px) {
  .extended-storage-modal__header .years-callout {
    padding: 16px;
  }
}
.extended-storage-modal__header .years-callout .year {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 4px;
  color: #3D9251;
}
.extended-storage-modal__header .years-callout .description {
  opacity: 0.6;
}
.extended-storage-modal__header .remove-button {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 26px;
  height: 26px;
  border-radius: 4px;
  transition: 0.2s all;
  cursor: pointer;
  outline: none;
}
.extended-storage-modal__header .remove-button:hover {
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 1px rgba(60, 66, 88, 0.18), 0px 3px 6px 0px rgba(60, 66, 88, 0.12);
}
.extended-storage-modal__header .remove-button .close-icon {
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
}
.extended-storage-modal__middle {
  padding: 20px 50px 30px 50px;
}
@media (max-width: 735px) {
  .extended-storage-modal__middle {
    padding: 20px 30px;
  }
}
.extended-storage-modal__middle .section-title {
  font-weight: 600;
  font-size: 15px;
  margin-top: 20px;
  margin-bottom: 8px;
}
.extended-storage-modal__middle .sales-point {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 4px;
}
.extended-storage-modal__middle .sales-point md-icon {
  margin: 0 12px 0 0;
  color: #5BBF71;
}
.extended-storage-modal__middle .text {
  opacity: 0.85;
  line-height: 2;
}
.extended-storage-modal__bottom {
  padding: 28px 50px;
  border-top: 1px solid rgba(218, 220, 232, 0.8);
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: rgba(239, 241, 245, 0.5);
}
@media (max-width: 735px) {
  .extended-storage-modal__bottom {
    padding: 20px 30px;
  }
}

.qr-modal {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
@media (max-width: 735px) {
  .qr-modal {
    min-width: 100vw;
  }
}
@media (min-width: 960px) {
  .qr-modal {
    width: 640px;
    min-height: 560px;
  }
}
.qr-modal [hidden] {
  display: none !important;
}
.qr-modal #loadingState {
  position: absolute;
  margin-top: 180px;
  align-self: center;
  align-items: center;
  justify-content: center;
  display: flex;
  flex-direction: column;
  flex: 1;
  z-index: 2;
}
.qr-modal #loadingState .loading-text {
  opacity: 0.6;
  text-align: center;
}
.qr-modal .input-container.camera {
  position: absolute;
  left: 20px;
  top: 20px;
  width: 166px;
  z-index: 2;
}
.qr-modal .input-container.camera .input-element {
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0 30px 0 10px !important;
  -webkit-padding-end: 30px !important;
  -webkit-padding-start: 10px !important;
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow: none;
  color: white;
}
.qr-modal .input-container.camera .input-element option {
  color: #15394C;
}
.qr-modal .input-container.camera .input-element {
  font-size: 13px;
}
.qr-modal .input-container.camera .input-icon {
  right: -20px;
}
.qr-modal #video-container {
  z-index: 1;
  position: relative;
  background-color: rgba(20, 30, 40, 0.45);
}
@media (max-width: 735px) {
  .qr-modal #video-container {
    height: 50vh;
    width: 100%;
  }
}
.qr-modal #video-container #videoElement {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.qr-modal #video-container .scan-region-highlight {
  border-radius: 10px;
  box-shadow: 0 0 0 80vmax rgba(20, 30, 40, 0.45);
}
.qr-modal #video-container .scan-region-highlight:after {
  content: "";
  display: block;
  position: absolute;
  left: -16px;
  right: -16px;
  top: -16px;
  bottom: -16px;
  box-shadow: inset 0 0 0 2px white;
  border-radius: 14px;
  clip-path: polygon(20% -1%, 20% 15%, 80% 15%, 80% -1%, 101% -1%, 101% 20%, 86% 20%, 86% 80%, 101% 80%, 101% 101%, 80% 101%, 80% 80%, 19% 80%, 20% 101%, -1% 101%, -1% 80%, 13% 80%, 13% 18%, -1% 19%, 0 0);
  animation: maskBorder 2.4s infinite;
}
@keyframes maskBorder {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}
.qr-modal #video-container .scan-region-highlight-svg {
  stroke: white !important;
  display: none;
}
.qr-modal #video-container .code-outline-highlight {
  stroke: rgb(255, 255, 255) !important;
  stroke-width: 6 !important;
  stroke-linecap: round;
  fill-opacity: 0.25;
  stroke-dasharray: none !important;
}
.qr-modal #video-container.green-qr .code-outline-highlight {
  fill: green !important;
}
.qr-modal #video-container.red-qr .code-outline-highlight {
  fill: red !important;
}
.qr-modal #outputContent {
  margin-top: -8px;
  z-index: 2;
  min-height: 200px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background-color: rgb(246, 248, 250);
  transition: 0.4s ease-in-out all;
  padding: 22px;
  display: flex;
  flex-direction: column;
}
@media (max-width: 735px) {
  .qr-modal #outputContent input {
    font-size: 16px;
  }
}
.qr-modal #outputContent .loading-device {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex-grow: 1;
}
.qr-modal #outputContent .instructions {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  color: #15394C;
  font-size: 16px;
  font-weight: 600;
}
.qr-modal #outputContent .instructions.hidden {
  opacity: 0;
}
.qr-modal #outputContent.manual-input-mode {
  align-self: stretch;
  padding: 24px;
  justify-content: space-between;
}
.qr-modal #outputContent.manual-input-mode .manual-input {
  font-family: "Menlo", "monospace", "Open Sans";
}
.qr-modal #outputContent.visible {
  transform: translateY(0);
}
.qr-modal #outputContent .state-block {
  background-color: transparent;
}
.qr-modal #outputContent .state-block .sensor-state__type {
  font-size: 13px;
}
.qr-modal #outputContent .state-block .sensor-state__value {
  font-size: 17px;
}
.qr-modal #outputContent .actions {
  justify-content: space-between;
}
.qr-modal #outputContent .actions .md-button {
  width: 50%;
}
.qr-modal .close-modal-button {
  position: fixed;
  top: 14px;
  right: 10px;
  z-index: 6;
  line-height: normal;
  border-radius: 6px;
  min-width: 36px;
}

.claim-devices-modal {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
@media (max-width: 735px) {
  .claim-devices-modal {
    min-width: 100vw;
  }
}
@media (min-width: 960px) {
  .claim-devices-modal {
    max-width: 800px;
    height: 85vh;
    transition: 0.2s ease-in-out;
  }
  .claim-devices-modal.showing-qr-section {
    height: 80vh;
  }
  .claim-devices-modal.showing-qr-section .header-section {
    background-color: #a1a3a5;
  }
}
.claim-devices-modal .disabled-loading {
  opacity: 0.4;
  pointer-events: none;
}
.claim-devices-modal .header-section {
  background-color: #F1F3F7;
  border-bottom: 1px solid rgb(218, 220, 232);
  position: relative;
  transition: 0.25s ease;
}
.claim-devices-modal .header-section .info-text-section {
  padding: 28px 36px;
  color: #15394C;
}
@media (max-width: 735px) {
  .claim-devices-modal .header-section .info-text-section {
    padding: 16px;
  }
}
.claim-devices-modal .header-section .info-text-section .heading {
  font-size: 17px;
  margin-top: 0;
  font-weight: 600;
}
.claim-devices-modal .header-section .info-text-section .search-section {
  display: flex;
  flex-direction: row;
  align-items: center;
}
@media (max-width: 735px) {
  .claim-devices-modal .header-section .info-text-section .search-section {
    flex-direction: column;
    align-items: flex-start;
  }
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container {
  position: relative;
  display: flex;
  flex-grow: 1;
}
@media (max-width: 735px) {
  .claim-devices-modal .header-section .info-text-section .search-section .input-container {
    width: 100%;
    margin-top: 8px;
  }
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container .toggle-container {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  left: 0;
  padding: 0 10px;
  border-radius: 5px 0 0 5px;
  background-color: rgb(250, 250, 252);
  border-right: 1px solid #dfe1e4;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container .toggle-container .icon-button {
  background-color: white;
  margin: 0;
  height: 16px;
  min-height: auto;
  border-radius: 3px;
  line-height: 16px;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 8px;
  cursor: pointer;
  transition: none;
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container .toggle-container .icon-button.selected {
  background-color: #606c7b;
  color: white;
  border: 1px solid #606c7b;
  box-shadow: none;
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container .kit-id-input {
  display: block;
  flex-grow: 1;
  box-sizing: border-box;
  border-radius: 5px 0 0 5px;
  font-family: "Menlo", "monospace", "Open Sans";
  border: 0px;
  position: relative;
  padding: 0 12px 0 152px;
  height: 40px;
  background-color: #fff;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
  transition: all 0.2s ease-out;
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container .kit-id-input:focus {
  outline: none;
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container .kit-id-input::placeholder {
  font-family: "Open Sans", sans-serif;
  text-transform: none;
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container .kit-id-input::-webkit-input-placeholder {
  font-family: "Open Sans", sans-serif;
  text-transform: none;
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container .kit-id-input::-moz-placeholder {
  font-family: "Open Sans", sans-serif;
  text-transform: none;
}
.claim-devices-modal .header-section .info-text-section .search-section .input-container .kit-id-input:-ms-input-placeholder {
  font-family: "Open Sans", sans-serif;
  text-transform: none;
}
@media (max-width: 735px) {
  .claim-devices-modal .header-section .info-text-section .search-section .input-container .kit-id-input {
    border-radius: 5px;
    font-size: 16px;
  }
}
.claim-devices-modal .header-section .info-text-section .search-section .add-id-button {
  height: 40px;
  margin-left: 0;
  border-radius: 0 5px 5px 0;
  background-color: white;
}
@media (max-width: 735px) {
  .claim-devices-modal .header-section .info-text-section .search-section .add-id-button {
    border-radius: 5px;
    margin-top: 8px;
    height: 30px !important;
    min-height: 30px !important;
    line-height: 30px !important;
    min-width: fit-content;
  }
}
.claim-devices-modal .header-section .qr-section {
  position: relative;
  height: 400px;
  background-color: darkgray;
}
@media (max-width: 735px) {
  .claim-devices-modal .header-section .qr-section {
    height: 45vh;
  }
}
.claim-devices-modal .header-section .qr-section md-progress-circular svg path {
  stroke: white;
}
.claim-devices-modal .header-section .qr-section .loading-indicator {
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
.claim-devices-modal .header-section .qr-section .input-container.camera {
  position: absolute;
  left: 20px;
  top: 20px;
  width: 166px;
  z-index: 2;
}
.claim-devices-modal .header-section .qr-section .input-container.camera .input-element {
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0 30px 0 10px !important;
  -webkit-padding-end: 30px !important;
  -webkit-padding-start: 10px !important;
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow: none;
  color: white;
}
.claim-devices-modal .header-section .qr-section .input-container.camera .input-element option {
  color: #15394C;
}
.claim-devices-modal .header-section .qr-section .input-container.camera .input-element {
  font-size: 13px;
}
.claim-devices-modal .header-section .qr-section .input-container.camera .input-icon {
  right: -20px;
}
.claim-devices-modal .header-section .qr-section .video-container {
  overflow: hidden;
  position: relative;
  background-color: rgba(20, 30, 40, 0.45);
  height: 100%;
}
.claim-devices-modal .header-section .qr-section .video-container #videoElement {
  position: relative;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.claim-devices-modal .header-section .qr-section .video-container .scan-region-highlight {
  border-radius: 10px;
  box-shadow: 0 0 0 80vmax rgba(20, 30, 40, 0.45);
}
.claim-devices-modal .header-section .qr-section .video-container .scan-region-highlight:after {
  content: "";
  display: block;
  position: absolute;
  left: -16px;
  right: -16px;
  top: -16px;
  bottom: -16px;
  box-shadow: inset 0 0 0 2px white;
  border-radius: 14px;
  clip-path: polygon(20% -1%, 20% 15%, 80% 15%, 80% -1%, 101% -1%, 101% 20%, 86% 20%, 86% 80%, 101% 80%, 101% 101%, 80% 101%, 80% 80%, 19% 80%, 20% 101%, -1% 101%, -1% 80%, 13% 80%, 13% 18%, -1% 19%, 0 0);
  animation: maskBorder 2.4s infinite;
}
@keyframes maskBorder {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}
.claim-devices-modal .header-section .qr-section .video-container .scan-region-highlight-svg {
  stroke: white !important;
  display: none;
}
.claim-devices-modal .header-section .qr-section .video-container .code-outline-highlight {
  stroke: rgb(255, 255, 255) !important;
  stroke-width: 6 !important;
  stroke-linecap: round;
  fill-opacity: 0.25;
  stroke-dasharray: none !important;
}
.claim-devices-modal .header-section .qr-section .video-container.green-qr .code-outline-highlight {
  fill: green !important;
}
.claim-devices-modal .header-section .qr-section .video-container.red-qr .code-outline-highlight {
  fill: red !important;
}
.claim-devices-modal .header-section .qr-section #overlayCanvas {
  position: absolute;
  object-fit: cover;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 440px;
  transition: 0.4s ease-in-out all;
}
.claim-devices-modal .header-section .qr-section .close-qr-button {
  position: fixed;
  display: flex;
  top: 10px;
  right: 10px;
  z-index: 6;
  line-height: normal;
  border-radius: 6px;
  z-index: 2;
}
.claim-devices-modal .header-section .qr-section .close-qr-button .text {
  margin-left: 8px;
  color: white;
  text-transform: none;
}
.claim-devices-modal .header-section .qr-section .title {
  position: absolute;
  color: white;
  top: 32px;
  left: 0;
  right: 0;
  z-index: 5;
  text-align: center;
  z-index: 2;
}
.claim-devices-modal .header-section .qr-section .description {
  z-index: 2;
  position: absolute;
  color: white;
  left: 0;
  right: 0;
  text-align: center;
  bottom: 10px;
}
.claim-devices-modal .license-section {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  background-color: rgba(241, 243, 247, 0.2352941176);
  font-size: 0.98em;
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section {
    flex-direction: column;
    align-items: stretch;
    padding: 16px;
  }
}
.claim-devices-modal .license-section.warning-background {
  background-color: #fcefe6;
}
.claim-devices-modal .license-section .left-side {
  display: flex;
  flex-direction: row;
  align-items: center;
  border-right: 1px solid #dfe1e4;
  padding-right: 14px;
  height: 44px;
  margin-left: 34px;
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section .left-side {
    border-right: none;
    border-bottom: 1px solid #dfe1e4;
    padding-right: 0;
    padding-bottom: 12px;
    margin-left: 0;
    margin-bottom: 12px;
    height: auto;
    justify-content: space-between;
  }
}
.claim-devices-modal .license-section .left-side .activate-devices-label {
  margin: 0 16px 0 0;
  display: flex;
  align-items: center;
  gap: 4px;
}
.claim-devices-modal .license-section .right-side {
  display: flex;
  flex: 1;
  flex-direction: row;
  align-items: center;
  margin-right: 34px;
  padding-left: 16px;
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section .right-side {
    flex-direction: column;
    align-items: stretch;
    margin-right: 0;
    padding-left: 0;
  }
}
.claim-devices-modal .license-section .right-side.faded {
  opacity: 0.4;
}
.claim-devices-modal .license-section .right-side .license-header {
  margin-right: 4px;
  white-space: nowrap;
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section .right-side .license-header {
    margin-right: 0;
    margin-bottom: 4px;
    font-weight: 600;
  }
}
.claim-devices-modal .license-section .right-side .license-item {
  display: flex;
  align-items: center;
  gap: 4px;
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section .right-side .license-item {
    justify-content: space-between;
    padding: 4px 0;
  }
}
.claim-devices-modal .license-section .right-side .license-item .license-label {
  white-space: nowrap;
}
.claim-devices-modal .license-section .right-side .license-item .license-count {
  display: flex;
  align-items: center;
  gap: 2px;
}
.claim-devices-modal .license-section .right-side .license-item .license-value {
  font-weight: 600;
  margin-left: 2px;
}
.claim-devices-modal .license-section .right-side .license-item .license-loading {
  display: inline-block;
  margin: 0 4px;
}
.claim-devices-modal .license-section .right-side .license-item-with-button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: 1;
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section .right-side .license-item-with-button {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
}
.claim-devices-modal .license-section .right-side .license-item-with-button .license-item {
  flex: 1;
}
.claim-devices-modal .license-section .right-side .license-item-with-button .add-licenses-btn {
  transform: scale(0.95);
  margin-left: 8px;
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section .right-side .license-item-with-button .add-licenses-btn {
    transform: none;
    margin-left: 0;
    align-self: flex-end;
  }
}
.claim-devices-modal .license-section .right-side .small-divider {
  width: 1px;
  height: 16px;
  background-color: #dfe1e4;
  margin: 0 8px;
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section .right-side .small-divider {
    width: 100%;
    height: 1px;
    margin: 0;
  }
}
.claim-devices-modal .license-section .right-side .license-value {
  font-weight: 600;
}
.claim-devices-modal .license-section .right-side .strike-through {
  text-decoration: line-through;
  color: #7d8691;
  font-weight: 400;
}
.claim-devices-modal .license-section .too-few-licenses {
  display: flex;
  justify-content: center;
  flex: 1;
  color: #dc3b3b;
  font-weight: 600;
  padding: 16px;
  text-align: center;
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section .too-few-licenses {
    padding: 12px;
    font-size: 0.9em;
  }
}
.claim-devices-modal .license-section .info-text {
  display: flex;
  justify-content: center;
  flex: 1;
  padding: 12px;
  text-align: center;
}
@media (max-width: 735px) {
  .claim-devices-modal .license-section .info-text {
    font-size: 0.9em;
  }
}
.claim-devices-modal .kits-section {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
}
.claim-devices-modal .kits-section .md-row.no-highlight {
  background-color: inherit;
}
.claim-devices-modal .kits-section .md-row.highlight {
  background-color: rgba(103, 159, 186, 0.15);
}
@media (max-width: 735px) {
  .claim-devices-modal .kits-section .md-row .md-cell {
    font-size: 12px;
  }
}
.claim-devices-modal .kits-section .md-row .md-cell.left-padding {
  padding-left: 36px;
}
@media (max-width: 735px) {
  .claim-devices-modal .kits-section .md-row .md-cell.left-padding {
    padding-left: 8px;
  }
}
@media (max-width: 735px) {
  .claim-devices-modal .kits-section .copyable-value {
    max-width: 58px;
    margin: 4px 0;
    font-size: 9px;
  }
}
.claim-devices-modal .kits-section .claiming-progress-indicator {
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background-color: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(1px);
}
.claim-devices-modal .kits-section .claiming-progress-indicator .progress-circular.green path {
  stroke: yellowgreen;
}
.claim-devices-modal .kits-section .claiming-progress-indicator .description {
  opacity: 0.8;
  text-align: center;
  padding: 0 8px;
}
.claim-devices-modal .kits-section .claiming-progress-indicator .description.success {
  opacity: 1;
  font-weight: 600;
}
.claim-devices-modal .kits-section .claiming-progress-indicator .claim-checkmark {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.claim-devices-modal .kits-section .claiming-progress-indicator .check-fade {
  transition: all cubic-bezier(0.35, 1.55, 0.65, 1) 0.3s;
  transition-delay: 0.4s;
  opacity: 1;
  transform: scale(1.2) rotate(0deg);
}
.claim-devices-modal .kits-section .claiming-progress-indicator .check-fade.ng-hide {
  opacity: 0;
  transform: scale(0.5) rotate(-10deg);
}
.claim-devices-modal .kits-section .illustration-container {
  display: flex;
  flex-grow: 1;
  border-radius: 6px;
  margin: 12px 34px 20px 34px;
  background-color: #F6F7F8;
  border: 1px dashed #c3c5c7;
  padding: 12px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media (max-width: 735px) {
  .claim-devices-modal .kits-section .illustration-container {
    justify-content: center;
  }
}
.claim-devices-modal .kits-section .illustration-container .illustration-kit {
  max-height: 180px;
  pointer-events: none;
  user-select: none;
}
@media (max-width: 735px) {
  .claim-devices-modal .kits-section .illustration-container .illustration-kit {
    margin-right: 0;
    max-width: 70vw;
  }
}
.claim-devices-modal .kits-section .illustration-container .illustration-text {
  color: #15394C;
  text-align: center;
}
@media (max-width: 735px) {
  .claim-devices-modal .kits-section .illustration-container .illustration-text {
    margin: 24px 0;
  }
}
.claim-devices-modal .kits-section .illustration-container .illustration-text .header {
  font-weight: 600;
  font-size: 16px;
  margin-top: 0;
  margin-bottom: 0;
}
.claim-devices-modal .kits-section .illustration-container .illustration-text .description {
  font-size: 12px;
  opacity: 0.7;
  margin-top: 4px;
}
.claim-devices-modal .kits-section .footer {
  border-top: 1px solid rgb(218, 220, 232);
  background-color: white;
  height: 34px;
  padding: 20px 36px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.create-member {
  display: flex;
  flex-direction: column;
  margin-bottom: 16px;
}
@media (min-width: 736px) {
  .create-member {
    flex-direction: column;
    margin-bottom: 0;
  }
}
.create-member__email {
  max-width: 500px;
}
@media (min-width: 736px) {
  .create-member__email {
    margin-right: 24px;
  }
}
@media (min-width: 736px) {
  .create-member__role {
    margin-bottom: 0;
    margin-right: 24px;
  }
}
.create-member__submit {
  align-self: flex-start;
}
.create-member__submit .icon-button {
  margin-left: 0;
}
@media (max-width: 735px) {
  .create-member__submit {
    align-self: flex-start;
    margin-top: 4px;
    margin-left: 0;
  }
}
@media (min-width: 736px) {
  .create-member__submit {
    position: relative;
    margin-top: 22px;
  }
}

.member-pending {
  padding: 15px 20px;
  border-radius: 2px;
  background-color: rgb(246, 248, 250);
  display: flex;
  justify-content: space-between;
}
.member-pending__title {
  font-size: 13px;
  color: #17384c;
  text-transform: uppercase;
}
.member-pending__invite-url {
  margin-top: 12px;
}

.membership-table md-row:hover .icon-button.hover-activated {
  box-shadow: initial;
}
.membership-table .icon-button.hover-activated {
  box-shadow: none;
}

.map-section {
  display: flex;
  flex: 1;
  margin-bottom: 0;
  position: relative;
  overflow: hidden;
}
@media (min-width: 736px) and (max-width: 959px) {
  .map-section {
    min-height: 400px;
  }
}
@media (max-width: 735px) {
  .map-section {
    min-height: 300px;
    margin-top: 16px !important;
  }
}
.map-section .map-text-container {
  position: absolute;
  top: 0;
  left: 0;
  color: white;
  display: flex;
  flex-direction: row;
  margin: 12px;
}
.map-section .map-text-container .map-text {
  margin: 0;
  padding: 6px 10px;
  font-weight: 600;
  background-color: rgba(40, 50, 60, 0.25);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.14);
  backdrop-filter: blur(2px);
  border-radius: 6px;
  line-height: 1.3em;
}
.map-section #map {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  flex: 1;
  border-radius: 6px;
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}
@media (max-width: 735px) {
  .map-section #map {
    border-radius: 0;
  }
}
.map-section #map.pointer-crosshair .mapboxgl-canvas {
  cursor: crosshair;
}
.map-section .mapboxgl-ctrl-geocoder {
  min-width: 200px;
}
.map-section .mapboxgl-ctrl-geocoder--input {
  outline: none;
}
.map-section .confirm-dialog-container {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  animation: slide-up 0.3s ease-in-out;
}
.map-section .confirm-dialog-container.ng-hide {
  animation: slide-down 0.3s ease-in-out;
}
@keyframes slide-up {
  0% {
    transform: translateY(100%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-down {
  0% {
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    transform: translateY(100%);
    opacity: 0;
  }
}
.map-section .confirm-dialog-container .buttons {
  padding: 16px;
  border-radius: 8px 8px 0 0;
  background-color: rgba(40, 50, 60, 0.05);
  border: 1px solid rgba(40, 50, 60, 0.1);
  border-bottom: 0;
  backdrop-filter: blur(2px);
  display: flex;
  justify-content: center;
  gap: 12px;
}

.add-data-connector {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #f0f2f3;
  padding: 20px;
}
.add-data-connector__title {
  font-family: "Open Sans", sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 700;
  color: rgb(90, 110, 140);
}
.add-data-connector__desc {
  font-size: 14px;
}

.metric-widget-container {
  flex: 1 1 auto;
  display: flex;
  align-content: space-between;
  flex-wrap: wrap;
}
.metric-widget-container--cell {
  display: flex;
  flex-wrap: wrap;
  padding-right: 32px;
  position: relative;
}
.metric-widget-container--cell .metrics-refresh-button {
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -12px;
}
.metric-widget {
  flex: 1 0 33.33%;
  flex-wrap: wrap;
  white-space: nowrap;
  min-width: 60px;
  box-sizing: border-box;
}
.metric-widget--muted .metric-widget__value {
  color: rgba(33, 33, 33, 0.38);
}
.metric-widget--large {
  max-width: 180px;
  box-sizing: border-box;
  white-space: normal;
}
.metric-widget--large .metric-widget__value {
  font-size: 18px;
  line-height: 18px;
}
.metric-widget--large .metric-widget__icon {
  vertical-align: bottom;
}
.metric-widget--large .metric-widget__label {
  margin-top: 8px;
}
.metric-widget--success .metric-widget__icon {
  color: #b7c9a5;
}
.metric-widget--warning .metric-widget__icon {
  color: #cc8b8d;
}
.metric-widget__icon {
  vertical-align: sub;
  color: #17384c;
}
.metric-widget__value {
  display: inline-block;
  font-size: 13px;
  font-weight: bold;
  font-family: "Open Sans", sans-serif;
}

.metrics-refresh-button {
  cursor: pointer;
  color: #207da9;
  outline: none;
  transform: rotate(0deg);
}
.metrics-refresh-button:hover {
  color: rgb(25.6, 100, 135.2);
}
.metrics-refresh-button:active {
  color: rgb(20.48, 80, 108.16);
}

.data-connector-error {
  vertical-align: text-bottom !important;
  margin-right: 4px;
}

.data-connector-status {
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  font-weight: bold;
  color: #737678;
}
.data-connector-status--enabled {
  color: #57802f;
}
.data-connector-status--system-disabled {
  color: #cf252b;
}
.data-connector .block-title, .data-connector .popover-preferences__subtitle {
  font-size: 13px;
  margin: 0 0 8px 0;
  text-transform: none;
  color: #15394C;
}
.data-connector__labels .dt-chips.dt-chips--editing md-chips-wrap {
  background-color: transparent;
}
.data-connector .input-container .label-with-hint {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 4px;
}
.data-connector .clickable-header {
  font-weight: 600;
  cursor: pointer;
}
.data-connector .clickable-header:hover {
  opacity: 0.8;
  transition: 0.2s ease-out opacity;
}

.data-connector-type {
  align-self: center;
  margin-right: 16px;
}

.data-connector-control {
  border-radius: 2px;
  margin-bottom: 24px;
  padding: 12px 16px;
  flex-direction: column;
}
@media (min-width: 1180px) {
  .data-connector-control {
    flex-direction: row;
  }
}
.data-connector-control__state {
  display: flex;
}
@media (max-width: 1179px) {
  .data-connector-control__state {
    margin-bottom: 16px;
  }
}
@media (min-width: 1180px) {
  .data-connector-control__state {
    width: 50%;
  }
}
.data-connector-control__metrics {
  flex-grow: 1;
}
@media (max-width: 1365px) {
  .data-connector-control__metric-widgets {
    display: flex;
    justify-content: space-between;
  }
}
.data-connector-control .metrics-refresh-button {
  margin: -1px 0 0 8px;
}
.data-connector-control .metrics-refresh-button md-icon {
  position: relative;
  bottom: 2px;
}
.data-connector-control__action-title {
  display: flex;
}
.data-connector-control__current {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 2px;
  background-color: rgba(87, 128, 47, 0.05);
  padding: 12px;
  flex-grow: 1;
}
.data-connector-control__switch {
  flex-grow: 3;
  color: #207da9;
  margin-top: 8px;
}

.events-selector--error .events-selector__header {
  background-color: #f5d3d5;
}
.events-selector--error .events-selector__body {
  border: solid 1px #f5d3d5;
}
.events-selector--error md-checkbox:not(.md-checked) .md-icon {
  border-color: rgba(207, 37, 43, 0.54);
}
.events-selector--error + .events-selector-error {
  display: block;
}
.events-selector__header {
  border-radius: 6px 6px 0 0;
}
.events-selector__body {
  display: flex;
  flex-direction: column;
  border-top: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 0 0 6px 6px;
  margin-top: 8px;
  padding-top: 8px;
  opacity: 1;
  max-height: 1000px;
  overflow: hidden;
}
@media (min-width: 736px) {
  .events-selector__body {
    flex-direction: row;
  }
}
.events-selector__body > div {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
@media (min-width: 736px) {
  .events-selector__body > div {
    width: 50%;
  }
}
.events-selector__label {
  text-transform: capitalize;
  font-size: 13px;
  margin-right: 4px;
}
.events-selector__hint {
  font-size: 12px;
  color: #17384c;
  padding-left: 30px;
}
.events-selector__desc {
  margin-top: 2px;
  margin-bottom: 2px;
  font-size: 12px;
  color: rgb(90, 110, 140);
}
.events-selector__tag {
  display: inline-block;
  font-size: 11px;
  color: #17384c;
  padding: 0px 5px;
  font-weight: 600;
  opacity: 0.8;
  border: 1px solid lightgray;
  background-color: white;
  border-radius: 4px;
}
.events-selector__checkbox .md-container {
  top: 2px;
  transform: none;
  margin-top: 12px;
  background-color: white;
}
.events-selector md-checkbox .md-label {
  margin-left: 30px;
}
.events-selector__checkbox[disabled] .md-label {
  color: #000000;
}

.events-selector-error {
  display: none;
  margin-top: 8px;
  font-size: 12px;
  color: #cf252b;
}

.synchronize-data-connector .md-button {
  margin-left: 0px;
}

dt-cloud-connector-chart {
  display: block;
}

.ccon-graph-visibility-toggle md-icon {
  position: relative;
  top: -2px;
}

.chart--ccon .radio-status--ccon {
  display: inline-flex;
  position: relative;
  top: -2px;
}
.chart--ccon .highcharts-background {
  fill: transparent;
}

.sensor-state.sensor-state--ccon .sensor-state__icon {
  padding: 8px;
}
@media (min-width: 736px) {
  .sensor-state.sensor-state--ccon .sensor-state__icon {
    padding: 10px 0 10px 10px;
  }
}
.sensor-state.sensor-state--ccon .sensor-state__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.sensor-state.sensor-state--ccon .state-block__label {
  min-width: 100px;
  text-transform: none;
  color: #15394C;
}
.sensor-state.sensor-state--ccon .state-block__value--main {
  font-size: 19px;
}
@media (max-width: 735px) {
  .sensor-state.sensor-state--ccon .state-block__value--main {
    font-size: 15px;
  }
}
.sensor-state.sensor-state--ccon .state-block__value--main {
  text-transform: capitalize;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.sensor-state.sensor-state--ccon .state-block__value--main .dash {
  opacity: 0.3;
  font-size: 20px;
  margin: 0 8px;
}

.sensor-details__props .bottom-section {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-end;
  flex-wrap: wrap;
}

.ccon-connection-details {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}
@media (max-width: 735px) {
  .ccon-connection-details {
    flex-direction: column;
  }
}
.ccon-connection-details__column {
  flex: 1;
  min-width: 200px;
  padding: 12px;
  border-radius: 6px;
  border: 1px dashed rgb(216.742, 218.81, 231.218);
}
.ccon-connection-details__column.active {
  border: 1px solid rgb(217.371, 219.405, 231.609);
  background-color: white;
}
.ccon-connection-details__column-title {
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  font-weight: bold;
  color: rgb(90, 110, 140);
  text-transform: uppercase;
}
.ccon-connection-details__column-title md-icon {
  color: #57802f;
  vertical-align: bottom;
  margin-left: 2px;
}
.ccon-connection-details__column-title .dt-badge {
  margin-left: 6px;
  text-transform: none;
  vertical-align: middle;
}
.ccon-connection-details__column-title .info-hint {
  margin-left: 4px;
  text-transform: none;
}

.ccon-connection-prop {
  display: flex;
  flex-direction: column;
}
.ccon-connection-prop-content {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: baseline;
}
.ccon-connection-prop-content__label {
  color: #15394C;
  font-size: 14px;
}
.ccon-connection-prop-content__value {
  font-size: 14px;
  color: #232D33;
  font-family: "Open Sans", sans-serif;
  font-weight: bold;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.ccon-connection-prop-content__value .radio-status {
  height: 14px;
}
.ccon-connection-prop .cellular-description {
  margin-top: 8px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 8px;
  border-top: 1px solid rgb(218, 220, 232);
  padding-top: 8px;
}
.ccon-connection-prop .cellular-description md-icon {
  margin: 1px 0 0 0;
}
.ccon-connection-prop .cellular-description md-icon path {
  fill: rgba(21, 57, 76, 0.6);
}
.ccon-connection-prop .cellular-description .text {
  font-size: 12px;
  opacity: 0.9;
}

.ccon-icon {
  position: relative;
  z-index: 2;
}

.seen-sensors .project-option {
  border-radius: 6px;
  padding: 5px 8px;
  transition: 0.2s ease-out all;
  border: 1px solid rgba(218, 220, 232, 0.8);
  cursor: pointer;
  font-weight: 600;
  font-size: 0.98em;
  opacity: 0.8;
}
.seen-sensors .project-option:hover {
  border: 1px solid rgba(75, 158, 252, 0.65);
  background-color: rgba(248, 252, 255, 0.5);
}
.seen-sensors .project-option__selected {
  opacity: 1;
  border: 1px solid rgba(75, 158, 250, 0.8);
  background-color: rgb(248, 252, 255);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15);
}

dt-connectivity-chart {
  display: block;
}

.connectivity-tooltip__title {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #324249;
  margin-bottom: 4px;
  margin-top: 12px;
}
.connectivity-tooltip__title--secondary {
  display: inline-block;
  margin-top: 4px;
  margin-bottom: 6px;
  color: #17384c;
}
.connectivity-tooltip__title--ccon {
  color: rgb(90, 110, 140);
}
.connectivity-tooltip__title--ccon img {
  opacity: 0.7;
  height: 14px;
  margin-right: 11px;
}
.connectivity-tooltip__boost {
  background-color: rgba(255, 150, 21, 0.2);
}
.connectivity-tooltip__offline {
  color: #cf252b;
}
.connectivity-tooltip__offline:not(:empty)::before {
  color: #232D33;
  display: inline;
  content: ", ";
}
.connectivity-tooltip__title--ccon .connectivity-tooltip__offline:not(:empty)::before {
  display: none;
}
.connectivity-tooltip__list--ccon {
  opacity: 0.4;
}
.connectivity-tooltip__line {
  height: 24px;
  display: flex;
  align-items: flex-end;
  margin-bottom: 4px;
}
.connectivity-tooltip__checkbox {
  margin-bottom: 2px;
}
.connectivity-tooltip__legend {
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  align-self: center;
  margin-right: 8px;
}
.connectivity-tooltip__legend--color-0 {
  background-color: rgba(21, 57, 76, 0.9);
}
.connectivity-tooltip__legend--color-1 {
  background-color: rgba(102, 158, 193, 0.9);
}
.connectivity-tooltip__legend--color-2 {
  background-color: rgba(127, 83, 75, 0.9);
}
.connectivity-tooltip__legend--color-3 {
  background-color: rgba(90, 110, 140, 0.9);
}
.connectivity-tooltip__legend--color-4 {
  background-color: #884f8d;
}
.connectivity-tooltip__legend--color-5 {
  background-color: #97543a;
}
.connectivity-tooltip__legend--color-6 {
  background-color: #4a7f52;
}
.connectivity-tooltip__legend--color-7 {
  background-color: #b74c5f;
}
.connectivity-tooltip__legend--color-8 {
  background-color: rgba(21, 57, 76, 0.9);
}
.connectivity-tooltip__legend--color-9 {
  background-color: rgba(102, 158, 193, 0.9);
}
.connectivity-tooltip__legend--color-10 {
  background-color: rgba(127, 83, 75, 0.9);
}
.connectivity-tooltip__legend--color-11 {
  background-color: rgba(90, 110, 140, 0.9);
}
.connectivity-tooltip__legend--color-12 {
  background-color: #884f8d;
}
.connectivity-tooltip__legend--color-13 {
  background-color: #97543a;
}
.connectivity-tooltip__legend--color-14 {
  background-color: #4a7f52;
}
.connectivity-tooltip__legend--color-15 {
  background-color: #b74c5f;
}
.connectivity-tooltip__legend--color-16 {
  background-color: #71c329;
}
.connectivity-tooltip__radio {
  transform: scale(0.75);
}
.connectivity-tooltip__signal {
  font-size: 16px;
  margin-left: 12px;
  margin-right: 12px;
  font-weight: bold;
  font-family: "Open Sans", sans-serif;
}
.connectivity-tooltip__signal--color-0 {
  color: rgba(21, 57, 76, 0.9);
}
.connectivity-tooltip__signal--color-1 {
  color: rgba(102, 158, 193, 0.9);
}
.connectivity-tooltip__signal--color-2 {
  color: rgba(127, 83, 75, 0.9);
}
.connectivity-tooltip__signal--color-3 {
  color: rgba(90, 110, 140, 0.9);
}
.connectivity-tooltip__signal--color-4 {
  color: #884f8d;
}
.connectivity-tooltip__signal--color-5 {
  color: #97543a;
}
.connectivity-tooltip__signal--color-6 {
  color: #4a7f52;
}
.connectivity-tooltip__signal--color-7 {
  color: #b74c5f;
}
.connectivity-tooltip__signal--color-8 {
  color: rgba(21, 57, 76, 0.9);
}
.connectivity-tooltip__signal--color-9 {
  color: rgba(102, 158, 193, 0.9);
}
.connectivity-tooltip__signal--color-10 {
  color: rgba(127, 83, 75, 0.9);
}
.connectivity-tooltip__signal--color-11 {
  color: rgba(90, 110, 140, 0.9);
}
.connectivity-tooltip__signal--color-12 {
  color: #884f8d;
}
.connectivity-tooltip__signal--color-13 {
  color: #97543a;
}
.connectivity-tooltip__signal--color-14 {
  color: #4a7f52;
}
.connectivity-tooltip__signal--color-15 {
  color: #b74c5f;
}
.connectivity-tooltip__signal--color-16 {
  color: #71c329;
}

.sensor-state__container {
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.sensor-state__icon {
  padding: 8px;
  position: relative;
}
.sensor-state__co2 {
  padding: 0;
  pointer-events: none;
}
.sensor-state__temperature-and-humidity {
  padding: 0;
  pointer-events: none;
}
.sensor-state__motion {
  padding: 0;
  pointer-events: none;
}
.sensor-state__contact {
  width: 70px;
  height: 50px;
  padding: 10px 0 10px 6px;
  display: flex;
  align-items: center;
  justify-content: start;
}
.sensor-state__contact .sensor {
  position: relative;
  width: 29px;
  height: 50px;
  background-color: white;
  border-radius: 8px;
  box-shadow: inset 0 -1px 2px -1px rgba(50, 50, 93, 0.4), 0 3px 8px -1px rgba(50, 50, 93, 0.35), 0 1px 3px -1px rgba(20, 20, 40, 0.4);
}
.sensor-state__contact .sensor::before {
  content: "";
  position: absolute;
  width: 2px;
  height: 4px;
  border-radius: 2px;
  background-color: rgba(0, 0, 0, 0.15);
  right: 4px;
  top: 23px;
}
.sensor-state__contact .magnet {
  width: 12px;
  height: 28px;
  background-color: rgba(255, 255, 255, 0.2);
  border: 1px dashed rgba(50, 50, 93, 0.4);
  margin-left: 24px;
  border-radius: 4px;
  transition: all 0.3s ease;
}
.sensor-state__contact .magnet.visible {
  border: 1px dashed rgba(50, 50, 93, 0);
  box-shadow: inset 0 -1px 2px -2px rgba(50, 50, 93, 0.4), 0 3px 8px -1px rgba(50, 50, 93, 0.35), 0 1px 3px -1px rgba(20, 20, 40, 0.4);
  opacity: 1;
  background-color: white;
  margin-left: 6px;
}
.sensor-state__value.state-block__value--main {
  font-size: 19px;
}
.sensor-state__value .spacer {
  opacity: 0.2;
  margin-left: 2px;
  margin-right: 2px;
}
@media (max-width: 735px) {
  .sensor-state__value {
    line-height: 1.2;
  }
}
.sensor-state__time, .sensor-state__type {
  font-size: 12px;
  color: #17384c;
}
.sensor-state__details {
  text-transform: uppercase;
  font-weight: bold;
  line-height: 24px;
  color: #207da9;
}
.sensor-state__details md-icon {
  vertical-align: top;
}
.sensor-state.sensor-state--offline .sensor-icon {
  opacity: 0.5;
}
.sensor-state.sensor-state--offline img {
  opacity: 0.6;
}
.sensor-state.sensor-state--offline .sensor-state__value {
  color: #c9cdce;
}

.props-list {
  margin: 8px 0;
}
.props-list__term {
  width: 20%;
  display: inline-block;
  font-size: 12px;
  color: #232d33;
}
.props-list__term--fluid {
  width: auto;
  padding-right: 4px;
}
.props-list__value {
  display: inline-block;
  font-family: "Open Sans", sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: #17384c;
}

.connectivity-details {
  padding: 10px;
  border-top: 1px solid rgb(218, 220, 232);
  background-color: rgb(239, 241, 245);
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}
@media (min-width: 736px) {
  .connectivity-details {
    padding: 16px;
  }
}
.connectivity-details__help {
  font-size: 14px;
}
.connectivity-details__title {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  color: #232d33;
  font-weight: 700;
}
.connectivity-details__ccon {
  margin: 8px 0;
}
.connectivity-details .icons--boost-mode {
  position: relative;
  top: 1px;
}

.probe-connections-details {
  border-top: 1px solid rgb(218, 220, 232);
  background-color: rgb(239, 241, 245);
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  display: flex;
  flex-direction: column;
}
.probe-connections-details .probe-text {
  min-width: 240px;
  flex-grow: 1;
  flex-basis: min-content;
}
.probe-connections-details .connections-container {
  padding: 16px 22px 24px 22px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 12px;
}
.probe-connections-details .connections-container .wire-connections {
  flex-grow: 1;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  flex-wrap: wrap;
  background-color: white;
  border: 1px;
  border-radius: 8px;
  box-shadow: 0 0px 0px 1px rgba(0, 0, 0, 0.06), 0 4px 8px -6px rgba(0, 0, 0, 0.25);
}
.probe-connections-details .connections-container .wire-connections .wire-config {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  min-width: 140px;
  text-align: center;
}
.probe-connections-details .connections-container .wire-connections .wire-config:not(:last-child) {
  border-right: 1px solid rgba(218, 220, 232, 0.6);
}
.probe-connections-details .connections-container .wire-connections .wire-config.active {
  border: 1px solid #0ba50b;
  border-radius: 8px;
  background-color: rgba(14, 172, 14, 0.0509803922);
}
.probe-connections-details .connections-container .wire-connections .wire-config .wire-header {
  font-size: 14px;
  font-weight: 600;
  padding: 10px 0;
  border-bottom: 1px solid rgba(218, 220, 232, 0.6);
}
.probe-connections-details .connections-container .wire-connections .wire-config .wire-content {
  display: flex;
  flex-grow: 1;
  align-items: center;
  justify-content: center;
  padding: 10px;
}
.probe-connections-details .connections-container .wire-connections .wire-config .wire-content img {
  max-width: 130px;
}

.ccon-list {
  display: flex;
  align-items: center;
}
.ccon-list__details {
  margin-left: 10px;
  margin-top: -8px;
}
.ccon-list__sensor-img {
  transform: translateY(10px);
}
.ccon-list__ccon-img {
  margin-left: 8px;
}
.ccon-list__project-link {
  color: rgb(90, 110, 140);
  position: relative;
  top: -2px;
}
.ccon-list__project-link md-icon path {
  fill: rgb(90, 110, 140) !important;
}
.ccon-list__subline {
  font-size: 11px;
}

.device-details {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap-reverse;
  margin-top: 12px;
  column-gap: 24px;
  row-gap: 16px;
}
.device-details__section-one {
  flex: 10;
  min-width: 250px;
}
@media (max-width: 735px) {
  .device-details__section-one input, .device-details__section-one textarea {
    font-size: 16px !important;
  }
}
.device-details__section-two {
  border-right: 1px solid rgba(218, 220, 232, 0.6);
  padding-right: 24px;
  display: flex;
  flex-direction: column;
  align-content: flex-start;
  gap: 12px;
  min-width: fit-content;
  flex: 1;
}
@media (max-width: 735px) {
  .device-details__section-two {
    grid-template-columns: repeat(2, 1fr);
    border: none;
    padding-right: 0;
    gap: 16px;
  }
}
.device-details__section-two .show-more {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.device-details__section-two .item {
  display: flex;
  flex-direction: column;
}
@media (max-width: 735px) {
  .device-details__section-two .item.full-width-mobile {
    grid-column: 1/3;
  }
}
.device-details__section-two .item__key {
  opacity: 0.65;
  font-size: 0.95em;
}
.device-details__section-two .item__value {
  font-weight: 600;
  font-size: 0.95em;
}
.device-details__section-two .item .green-warranty-dot {
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 1px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  margin-left: 6px;
  background-color: #4da853;
}
.device-details__section-two .show-more-button {
  margin: 0 0 0 1px;
  font-size: 12px;
  width: 100%;
}
.device-details__section-two .show-more-button md-icon {
  transform: rotate(-90deg);
  margin-bottom: 2px;
  margin-left: 0;
  margin-right: 0;
}
.device-details__section-two .show-more-button md-icon.open {
  transform: rotate(90deg);
}

.responsive-double-col-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}
@media (max-width: 735px) {
  .responsive-double-col-layout {
    justify-content: space-between;
  }
  .responsive-double-col-layout .kinda-input-container__hint {
    display: none;
  }
}
@media (min-width: 736px) {
  .responsive-double-col-layout > * {
    flex-grow: 1;
  }
}
.responsive-double-col-layout .calibration-time {
  text-decoration: underline rgba(21, 57, 76, 0.4);
  text-underline-offset: 3px;
}
.responsive-double-col-layout .calibration-time:hover {
  cursor: pointer;
}

.accuracy-validation-container {
  overflow: hidden;
  border: 1px solid rgba(111, 161, 221, 0.72) !important;
}
.accuracy-validation-container .validation-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 16px 22px;
  border-radius: 8px 8px 0 0;
  background-color: #F6FAFF;
  border-bottom: 1px solid rgba(111, 161, 221, 0.72);
  gap: 16px;
}
.accuracy-validation-container .validation-header.with-results {
  flex-direction: column;
  align-items: start;
}
.accuracy-validation-container .validation-header--left-section {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.accuracy-validation-container .validation-header--left-section .warning-icon {
  margin-left: -6px;
  margin-top: -2px;
}
.accuracy-validation-container .validation-header--left-section .warning-icon path {
  fill: #FF9615;
}
.accuracy-validation-container .validation-header--right-section {
  display: flex;
  flex-direction: row;
  gap: 8px;
}
.accuracy-validation-container .validation-header--right-section .confirm-cancel {
  background-color: rgba(255, 0, 0, 0.1098039216) !important;
  box-shadow: 0 0 0 1px #e08149, 0 2px 2px 1px rgba(224, 128, 73, 0.1764705882) !important;
}
.accuracy-validation-container .validation-header .results {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-self: stretch;
  align-items: center;
  flex: 1;
  gap: 20px;
  background-color: white;
  border: 1px solid rgba(111, 161, 221, 0.72);
  padding: 12px 18px;
  border-radius: 6px;
}
.accuracy-validation-container .validation-header .results .result-buttons {
  display: flex;
  flex-direction: row;
  flex: 1;
  gap: 8px;
  align-items: center;
}
.accuracy-validation-container .validation-header .results .result-buttons .accept md-icon path {
  fill: #6db061;
}
.accuracy-validation-container .validation-header .results .result-buttons .discard md-icon path {
  fill: #c87864;
}
.accuracy-validation-container .validation-graph {
  padding: 18px;
  display: block;
}
.accuracy-validation-container .validation-graph .highcharts-yaxis-grid .highcharts-grid-line {
  stroke-width: 1;
}

.validation-reset-zoom-btn {
  background: white;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  margin-top: 12px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  color: inherit;
}
.validation-reset-zoom-btn:hover {
  background: #f5f5f5;
}

.calibration-modal {
  color: #15394C;
  border: none !important;
  width: 820px;
  max-width: 100%;
  text-align: center;
}
@media (max-width: 735px) {
  .calibration-modal {
    width: initial;
  }
}
.calibration-modal.wider {
  width: 700px;
}
.calibration-modal .initial-open-state {
  padding: 50px 50px 36px 50px !important;
  background-color: #f6f8fa;
}
@media (max-width: 735px) {
  .calibration-modal .initial-open-state {
    padding: 50px 10px 36px 10px !important;
  }
}
.calibration-modal .initial-open-state .heading {
  font-size: 15px;
  font-weight: 600;
  margin-top: 10px;
}
.calibration-modal .initial-open-state .legal-text {
  margin-top: 22px;
  margin-bottom: 0px;
  font-size: 12px;
  opacity: 0.8;
}
.calibration-modal .initial-open-state .separator {
  margin: 30px -50px;
  border-top: 1px solid rgba(21, 57, 76, 0.2);
}
.calibration-modal .initial-open-state .reference-table {
  background-color: transparent;
}
.calibration-modal .initial-open-state .reference-table .table-header {
  background: transparent;
}
.calibration-modal .initial-open-state .reference-table .kinda-input-container__value {
  display: flex;
  align-items: center;
  word-break: normal;
}
.calibration-modal .initial-open-state .reference-table .kinda-input-container__value .copyable-value {
  font-size: 13px;
}
.calibration-modal .initial-open-state .reference-table .kinda-input-container__value .copy-icon-button {
  min-width: 0;
  min-height: 0;
  padding: 0;
  margin: 0 0 0 2px;
  line-height: normal;
}
.calibration-modal .initial-open-state .reference-table tr[md-row]:hover {
  background-color: rgba(0, 0, 0, 0.03);
}
.calibration-modal .initial-open-state .reference-table .md-cell {
  font-size: 13px;
  vertical-align: middle;
  padding-top: 12px;
  padding-bottom: 12px;
}
.calibration-modal .initial-open-state .reference-table th:nth-child(1), .calibration-modal .initial-open-state .reference-table td:nth-child(1) {
  width: 1%;
  white-space: nowrap;
}
.calibration-modal .initial-open-state .reference-table th:nth-child(3), .calibration-modal .initial-open-state .reference-table th:nth-child(4), .calibration-modal .initial-open-state .reference-table th:nth-child(5), .calibration-modal .initial-open-state .reference-table th:nth-child(6), .calibration-modal .initial-open-state .reference-table td:nth-child(3), .calibration-modal .initial-open-state .reference-table td:nth-child(4), .calibration-modal .initial-open-state .reference-table td:nth-child(5), .calibration-modal .initial-open-state .reference-table td:nth-child(6) {
  width: 1%;
  white-space: nowrap;
}
.calibration-modal .initial-open-state .reference-table .expanded-chart-row:hover {
  background-color: transparent !important;
}
.calibration-modal .initial-open-state .reference-table .expanded-chart-row td {
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  background-color: rgba(0, 0, 0, 0.015);
  white-space: normal !important;
  width: auto !important;
}
.calibration-modal .flow-container {
  display: flex;
  flex-direction: column;
}
.calibration-modal .flow-container .flow-header {
  background-color: #f6f8fa;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
  padding: 20px 30px;
  border-bottom: 1px solid rgba(218, 220, 232, 0.6);
}
.calibration-modal .flow-container .flow-header .left-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  font-size: 14px;
}
.calibration-modal .flow-container .flow-content {
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}
.calibration-modal .flow-container .flow-content .list-info {
  display: flex;
  padding: 8px 12px;
  background-color: #f5f5f5;
  border: 1px solid rgba(211, 211, 211, 0.8);
  border-radius: 6px;
  flex: 1;
}
.calibration-modal .flow-container .flow-content .highcharts-background {
  fill: transparent;
}
.calibration-modal .flow-container .flow-content .highcharts-yaxis-grid .highcharts-grid-line {
  stroke-width: 1;
}
@media (max-width: 735px) {
  .calibration-modal .flow-container .flow-content .select-sensor-container {
    padding-left: 12px;
    padding-right: 12px;
  }
}
.calibration-modal .flow-container .flow-content .select-sensor-container .search-box {
  display: flex;
  position: sticky;
  top: 1px;
  z-index: 2;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .search-box .icon-button:disabled {
  opacity: 0.9;
  background-color: rgb(248, 248, 250);
}
.calibration-modal .flow-container .flow-content .select-sensor-container .search-box .icon-button:disabled .icon-button__text {
  opacity: 0.65;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-table {
  background-color: transparent;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .table-header {
  background-color: transparent;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 10px;
  padding-right: 12px;
  margin-bottom: 4px;
  outline: none;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 6px;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row:hover {
  transition: all 0.2s ease-in-out;
  border: 1px solid rgba(75, 158, 252, 0.65);
  background-color: rgba(234, 242, 255, 0.5);
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row .icons {
  transition: all 0.2s ease-in-out;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row.non-selectable {
  opacity: 0.4;
  border: 1px solid transparent;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row .name {
  margin: 0;
  text-align: left;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row .name .description {
  font-weight: normal !important;
  font-size: 0.9em;
  opacity: 0.6;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row.selected, .calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row:active {
  border: 1px solid rgba(75, 158, 252, 0.8);
  background-color: rgb(234, 242, 255);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15);
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row.selected .name, .calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row:active .name {
  font-weight: 600;
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row.selected .icons, .calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row:active .icons {
  border-color: transparent;
  background-color: white;
  border-radius: 4px;
  box-shadow: 0 0px 1px rgb(20, 40, 60), 0 2px 5px -2px rgba(20, 60, 100, 0.3), 0 4px 10px -2px rgba(70, 100, 130, 0.1);
}
.calibration-modal .flow-container .flow-content .select-sensor-container .sensor-row .section {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.calibration-modal .flow-container .flow-content .sensor-info {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  border-radius: 6px;
  width: calc(100% - 40px);
  padding: 4px 20px;
  border: 1px solid rgba(75, 158, 252, 0.7);
  background-color: rgba(234, 242, 255, 0.7);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.03), 0px 2px 6px -3px rgba(20, 60, 100, 0.08), 0px 12px 20px -10px rgba(70, 100, 130, 0.12);
}
.calibration-modal .flow-container .flow-content .sensor-info dt-icon .icons {
  background-color: white;
}
.calibration-modal .flow-container .flow-content .sensor-info .sensor-row {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.calibration-modal .flow-container .flow-content .sensor-info .sensor-row .sensor-role {
  align-items: center;
  text-align: left;
  display: flex;
  width: 120px;
  height: 36px;
  margin-right: 15px;
  padding-right: 15px;
  border-right: 1px solid rgba(218, 220, 232, 0.6);
}
.calibration-modal .flow-container .flow-content .sensor-info .sensor-row .name {
  text-align: left;
  line-height: 16px;
  margin: 8px 0;
}
.calibration-modal .flow-container .flow-content .sensor-info .sensor-row .name .description {
  font-size: 0.9em;
  opacity: 0.6;
}
.calibration-modal .flow-container .flow-content .sensor-info .sensor-row .radio {
  margin-left: auto;
  display: flex;
  gap: 30px;
  flex-direction: row;
  align-items: center;
  line-height: 1.2em;
}
.calibration-modal .flow-container .flow-content .sensor-info .extra-row {
  border: 1px solid lightgray;
  padding: 12px 20px;
  margin: 6px -21px -8px;
  border-radius: 0 0 6px 6px;
  text-align: left;
  background-color: white;
}
.calibration-modal .flow-container .flow-content .illustration-container {
  display: flex;
  flex-direction: row;
  align-self: center;
  flex-wrap: wrap;
  gap: 50px;
  margin: 20px 0;
}
.calibration-modal .flow-container .flow-content .illustration-container .illustration {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  max-width: 170px;
}
.calibration-modal .flow-container .flow-content .illustration-container .illustration .illustration-image {
  width: 140px;
}
.calibration-modal .flow-container .flow-content .illustration-container .illustration .illustration-text {
  font-size: 12px;
  opacity: 0.9;
  text-align: left;
}
.calibration-modal .flow-container .flow-footer {
  background-color: #f6f8fa;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
  padding: 20px 30px;
  border-top: 1px solid rgba(218, 220, 232, 0.6);
}

.content-box #remarks-warning {
  margin: -30px 0 0 0;
  z-index: 1;
  opacity: 0;
  height: 0;
  font-weight: 600;
  text-align: right;
  line-height: 8px;
  transition: 0.25s opacity;
  pointer-events: none;
}
.content-box #remarks-warning.visible {
  height: auto;
  opacity: 0.85;
  pointer-events: all;
}
.content-box #remarks-warning .warning-icon {
  margin-top: -2px;
}
.content-box #remarks-warning .warning-icon path {
  fill: #FF9615;
}
.content-box #remarks-warning .second-line {
  font-size: 0.95em;
  font-weight: 400;
}

.deactivate-modal {
  padding: 24px;
  text-align: center;
  color: #15394C;
  border: none !important;
  max-width: 400px;
}
.deactivate-modal .header {
  font-size: 14px;
  font-weight: 600;
}
.deactivate-modal .sub-header {
  font-weight: 400;
}
.deactivate-modal .note {
  background-color: rgba(255, 193, 7, 0.1);
  border: 1px solid rgba(255, 193, 7, 0.4);
  border-radius: 6px;
  padding: 10px 14px;
  margin-top: 12px;
  font-size: 13px;
  text-align: left;
}
.deactivate-modal .actions {
  display: flex;
  flex-direction: row;
  gap: 20px;
  justify-content: center;
  margin-top: 24px;
}
.deactivate-modal .actions .icon-button {
  min-width: 140px;
  margin: 0;
}
.deactivate-modal .actions .icon-button.deactivate {
  background-color: rgb(194, 58, 58);
}
.deactivate-modal .actions .icon-button.deactivate .icon-button__text {
  color: white;
}
.deactivate-modal .actions .icon-button.deactivate md-progress-circular path {
  stroke: white;
}
.deactivate-modal .actions .icon-button.deactivate:hover {
  background-color: rgb(168, 41, 41) !important;
}

dt-thing-chart {
  display: block;
}

.chart-container--loading .chart-zoom-controls,
.chart-container--loading .highcharts-scrollbar {
  pointer-events: none;
}

.dt-highcharts-number {
  font-family: "Open Sans", sans-serif;
  font-weight: bold;
  color: rgb(90, 110, 140);
}

.chart-zoom-container {
  display: flex;
  justify-content: flex-end;
}

.chart-zoom-controls {
  display: inline-flex;
  align-self: flex-end;
  justify-content: flex-end;
  align-items: center;
  margin-top: 16px;
  margin-bottom: 20px;
  background-color: rgb(245, 247, 250);
  box-shadow: 0px 0px 0px 1px rgba(60, 66, 88, 0.1);
  border-radius: 4px;
  padding: 0 8px;
}
.chart-zoom-controls__label {
  font-size: 12px;
  opacity: 0.7;
  padding: 4px;
}
.chart-zoom-controls__button {
  outline: none;
  margin: 5px 0 5px 4px;
  font-weight: 600;
  font-size: 13px;
  color: #15394C;
  border: none;
  background: none;
  border-radius: 5px;
  padding: 4px 8px;
}
.chart-zoom-controls__button:hover {
  box-shadow: 0px 0px 0px 1px rgba(60, 66, 88, 0.2);
  background-color: rgba(255, 255, 255, 0.7);
}
.chart-zoom-controls__button.chart-zoom-controls__button--selected {
  background-color: white;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
}

dt-sensor-chart {
  position: relative;
  display: block;
}
dt-sensor-chart .chart-top-right-items {
  z-index: 4;
  position: absolute !important;
  top: 0;
  right: 6px;
  width: fit-content;
  transform: scale(0.92);
  display: flex;
  flex-direction: row;
}
dt-sensor-chart .chart-top-right-items .top-right-item {
  position: relative;
}
dt-sensor-chart .chart-top-right-items .top-right-item .input-element {
  height: 30px;
  line-height: 30px;
}
dt-sensor-chart .chart-top-right-items .top-right-item .input-icon {
  bottom: 7px;
}
dt-sensor-chart .chart-top-right-items .top-right-item .input-dropdown {
  top: 40px;
  right: -15px;
}

.labels-section {
  display: flex;
  align-items: center;
  cursor: pointer;
  margin-top: 16px;
}
.labels-section .chevron {
  margin: 0 0 0 -8px;
  transform: rotate(-90deg);
}
.labels-section .chevron.open {
  transform: rotate(0deg);
}
.labels-section .heading .text {
  font-weight: 400;
  opacity: 0.65;
  font-size: 12px;
}

md-table-container.table-container.table-container--labels {
  overflow: visible;
}
md-table-container.table-container.table-container--labels .md-table {
  overflow: visible;
}
md-table-container.table-container.table-container--labels .md-row {
  height: 30px !important;
}
md-table-container.table-container.table-container--labels .md-row.expanded {
  height: 40px !important;
}
@media (max-width: 735px) {
  md-table-container.table-container.table-container--labels .md-row.expanded {
    height: 44px !important;
  }
  md-table-container.table-container.table-container--labels .md-row.expanded .input-element {
    transition: none;
    height: 32px !important;
  }
  md-table-container.table-container.table-container--labels .md-row.expanded td.md-cell {
    font-size: 14px;
  }
}
md-table-container.table-container.table-container--labels .md-row td {
  padding: 0;
}
md-table-container.table-container.table-container--labels .md-row td .material-icons {
  transition: color 0.2s;
}
md-table-container.table-container.table-container--labels .md-row td.md-cell {
  border-top: none;
}
md-table-container.table-container.table-container--labels .md-row .table-header {
  font-size: 12px;
  text-transform: none;
  font-weight: 400;
  color: #15394C !important;
  border-bottom: 1px solid rgb(218, 220, 232);
}
md-table-container.table-container.table-container--labels .md-row .table-header .header-text {
  opacity: 0.65;
}
md-table-container.table-container.table-container--labels .md-row th.column--key,
md-table-container.table-container.table-container--labels .md-row td.column--key {
  padding: 0 8px 0 2px;
}
md-table-container.table-container.table-container--labels .md-row th.column--value,
md-table-container.table-container.table-container--labels .md-row td.column--value {
  padding: 0 !important;
  word-break: break-all;
}
md-table-container.table-container.table-container--labels .md-row th.column--value {
  width: 60%;
}
md-table-container.table-container.table-container--labels .md-row td.column--key .input-element,
md-table-container.table-container.table-container--labels .md-row td.column--value .input-element {
  padding-left: 6px !important;
  font-size: 13px;
  height: 26px;
}
md-table-container.table-container.table-container--labels .md-row td.column--remove .md-button {
  height: 32px;
}
md-table-container.table-container.table-container--labels .md-errors-spacer {
  display: none;
}

.device-label__input {
  margin: 0;
}

.add-label-form {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
}
@media (min-width: 1366px) {
  .add-label-form {
    flex-direction: row;
    margin-bottom: 4px;
  }
}
.add-label-form__input {
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
}
@media (min-width: 1366px) {
  .add-label-form__input {
    margin-top: 4px;
  }
}
.add-label-form .icon-button {
  margin-left: 0;
  margin-top: 0;
}
@media (min-width: 1366px) {
  .add-label-form > *:not(:first-child) {
    margin-left: 24px;
  }
}

.bulk-actions-toolbar {
  display: none;
}
@media (min-width: 736px) {
  .bulk-actions-toolbar {
    display: flex;
    padding-left: 20px;
    padding-right: 24px;
    margin-left: -20px;
    margin-right: -20px;
    background-color: #fff;
    z-index: 15;
    align-items: center;
    transition: background-color 0.2s;
  }
}
.bulk-actions-toolbar--active .bulk-actions-toolbar__selected-text {
  color: #232d33;
}
.bulk-actions-toolbar--active {
  background-color: rgba(239, 241, 245, 0.7);
}
.bulk-actions-toolbar__selected-text {
  color: #697878;
  flex-grow: 1;
  margin-left: 16px;
}
.bulk-actions-toolbar__btn {
  min-width: 0;
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

md-dialog-content {
  color: #15394C;
}
md-dialog-content.sensor-configuration-dialog-content {
  min-width: 500px;
  padding: 36px;
  font-size: 13px;
}
md-dialog-content.sensor-configuration-dialog-content p {
  font-size: 13px;
}
md-dialog-content.sensor-configuration-dialog-content .configuration-type {
  border-bottom: none;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
md-dialog-content.sensor-configuration-dialog-content .configuration-sensors {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  padding-bottom: 0;
  display: flex;
  flex-direction: column;
}
md-dialog-content.sensor-configuration-dialog-content .configuration-sensors .sensor-selection {
  display: flex;
  align-items: center;
}
md-dialog-content.sensor-configuration-dialog-content .configuration-sensors .sensor-table {
  max-width: 550px;
  max-height: 220px;
  padding-bottom: 12px;
}
md-dialog-content.sensor-configuration-dialog-content .configuration-sensors .sensor-table th.md-column:last-child, md-dialog-content.sensor-configuration-dialog-content .configuration-sensors .sensor-table td.md-cell:last-child {
  padding-right: 12px !important;
}
md-dialog-content.sensor-configuration-dialog-content .configuration-sensors .sensor-table p {
  margin-top: 10px;
  margin-bottom: 10px;
}

.sensor-configurations .content-container {
  gap: 16px;
  padding: 18px;
}
@media (max-width: 735px) {
  .sensor-configurations .content-container {
    padding: 0;
  }
}
.sensor-configurations .configuration-title {
  font-weight: 600;
  text-transform: uppercase;
}
.sensor-configurations .loading-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
}
.sensor-configurations .loading-container md-progress-circular {
  border-radius: 50%;
  box-shadow: inset 0 0 0 3px #C3D4E5;
}
.sensor-configurations .warning path {
  fill: #FF9615;
}
.sensor-configurations .right-section {
  flex-grow: 1;
  min-height: 160px;
  border-radius: 8px;
  margin-bottom: 2px;
  border: 1px dashed #dadce8;
  background-color: rgb(246, 248, 250);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media (max-width: 735px) {
  .sensor-configurations .right-section {
    margin-top: 16px;
  }
}
@media (min-width: 736px) and (max-width: 959px) {
  .sensor-configurations .right-section {
    margin-top: 16px;
  }
}
.sensor-configurations .right-section .heartbeat-interval-text {
  background-color: #f6f8fa;
  border: 1px solid #A2ACB8;
  font-size: 0.85em;
  font-weight: 600;
  color: #4E5762;
  padding: 2px 8px;
  border-radius: 16px;
}
.sensor-configurations .right-section .side-fade {
  position: absolute;
  height: 100%;
  width: 60px;
  border-radius: 8px;
  z-index: 2;
}
.sensor-configurations .right-section .side-fade_left {
  background: linear-gradient(90deg, #f6f8fa, #f6f8fa, rgba(246, 248, 250, 0.1254901961));
  left: 0px;
}
.sensor-configurations .right-section .side-fade_right {
  background: linear-gradient(90deg, rgba(246, 248, 250, 0.1254901961), #f6f8fa, #f6f8fa);
  right: 0px;
}
@media (max-width: 735px) {
  .sensor-configurations .right-section .side-fade {
    display: none;
  }
}
.sensor-configurations .right-section .config-preview-text {
  width: calc(100% - 24px);
  position: absolute;
  text-align: left;
  font-size: 12px;
  opacity: 0.8;
  z-index: 3;
  top: 0;
}
.sensor-configurations .right-section .config-preview-text_right {
  text-align: right !important;
}
.sensor-configurations .right-section .config-preview {
  position: relative;
  width: 100%;
  height: 44px;
}
.sensor-configurations .right-section .config-preview .line {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 16px;
  right: 16px;
  height: 2px;
  margin: auto 0;
  background-color: #A2ACB8;
}
.sensor-configurations .right-section .config-preview .events {
  top: 0;
  bottom: 0;
  left: 60px;
  right: 60px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: absolute;
}
@media (max-width: 735px) {
  .sensor-configurations .right-section .config-preview .events {
    left: 30px;
    right: 30px;
  }
}
@media (max-width: 1365px) {
  .sensor-configurations .right-section .config-preview .events {
    left: 30px;
    right: 30px;
  }
}
.sensor-configurations .right-section .config-preview .events .heartbeat {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background-color: white;
  border: 2px solid rgba(255, 83, 49, 0.9);
  z-index: 2;
  position: relative;
}
.sensor-configurations .right-section .config-preview .events .heartbeat::before {
  content: "";
  margin: 0 auto;
  position: absolute;
  left: 0;
  right: 0;
  top: 15px;
  opacity: 0.8;
  width: 1px;
  height: 16px;
  background-color: #A2ACB8;
}
.sensor-configurations .right-section .config-preview .events .heartbeat::after {
  content: "Heartbeat";
  margin: 0 auto;
  position: absolute;
  left: -20px;
  right: 0;
  top: 31px;
  opacity: 0.5;
  font-size: 11px;
}
.sensor-configurations .right-section .config-preview .events .sample {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: white;
  z-index: 2;
  border: 2px solid #a2acb8;
}
.sensor-configurations .right-section .config-preview .events .sample.ng-move,
.sensor-configurations .right-section .config-preview .events .sample.ng-enter,
.sensor-configurations .right-section .config-preview .events .sample.ng-leave {
  -webkit-transition: all ease 0.25s;
  transition: all ease 0.25s;
}
.sensor-configurations .right-section .config-preview .events .sample.ng-leave.ng-leave-active,
.sensor-configurations .right-section .config-preview .events .sample.ng-move,
.sensor-configurations .right-section .config-preview .events .sample.ng-enter {
  opacity: 0;
  transform: scale(0.8) translateY(-3px);
}
.sensor-configurations .right-section .config-preview .events .sample.ng-leave,
.sensor-configurations .right-section .config-preview .events .sample.ng-move.ng-move-active,
.sensor-configurations .right-section .config-preview .events .sample.ng-enter.ng-enter-active {
  opacity: 1;
  transform: scale(1);
}
.sensor-configurations .right-section .description {
  text-align: center;
  margin: 0;
  width: 50%;
  font-size: 0.95em;
  opacity: 0.9;
}
.sensor-configurations .extra-description {
  margin: 0;
  opacity: 0.75;
  font-size: 12px;
}
.sensor-configurations.motion {
  border-bottom: 1px solid #dadce8;
  padding: 0;
}
@media (max-width: 735px) {
  .sensor-configurations.motion {
    margin-bottom: 16px;
  }
}
.sensor-configurations.motion .section {
  padding: 16px;
}
@media (max-width: 735px) {
  .sensor-configurations.motion .section {
    padding: 16px 0px;
  }
}
.sensor-configurations.motion .section {
  flex-basis: 50%;
}
@media (min-width: 960px) {
  .sensor-configurations.motion .section.border-right {
    border-right: 1px solid rgb(218, 220, 232);
  }
}
.sensor-configurations.motion .section .title {
  font-size: 0.95em;
  margin-top: 0;
  font-weight: 600;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sensor-configurations.motion .section .title .last-updated {
  opacity: 0.6;
  font-weight: 400;
  font-size: 12px;
  text-align: right;
}
.sensor-configurations.motion .section .description {
  margin-bottom: 0;
  font-size: 0.95em;
  opacity: 0.85;
}
.sensor-configurations.motion .section .input-container.disabled {
  opacity: 0.7;
  pointer-events: none;
}
.sensor-configurations.motion .section .activity-timer {
  opacity: 0.6;
  transition: all ease-in-out 0.5s;
}
.sensor-configurations.motion .section .activity-timer.invalid {
  opacity: 0.9;
  font-weight: 600;
  color: rgba(230, 30, 30, 0.9);
}
.sensor-configurations .bottom-section {
  border-top: 1px solid rgb(218, 220, 232);
  padding: 16px;
}
.sensor-configurations .calibration-container {
  border-top: 1px solid rgb(218, 220, 232);
  padding: 16px 22px 24px 22px;
}
.sensor-configurations .calibration-container .input-container {
  display: flex;
  flex-wrap: wrap-reverse;
  flex-direction: row;
  row-gap: 6px;
  column-gap: 28px;
}
.sensor-configurations .calibration-container .input-container .label {
  white-space: normal;
  opacity: 1;
  width: 410px;
}
.sensor-configurations .calibration-container .input-container .input-and-preview {
  width: 296px;
  position: relative;
  display: block;
}
.sensor-configurations .calibration-container .input-container .input-and-preview .input-element {
  width: 296px !important;
}
.sensor-configurations .calibration-container .input-container .input-and-preview .preview {
  opacity: 0.8;
  white-space: nowrap;
  margin: 0;
  position: absolute;
  top: 6px;
  right: -4px;
}

.emulator-controller .input-first-sample {
  max-width: 36px;
  padding: 0 4px !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  background-color: transparent !important;
  text-align: center;
}
.emulator-controller .input-samples {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}
.emulator-controller .event-preview {
  line-height: 1.3;
  font-family: "Menlo", "monospace", "Open Sans";
  margin-bottom: 0;
}

.role-dropdown {
  display: block;
}
@media (min-width: 1366px) {
  .role-dropdown {
    max-width: 300px;
  }
}

.export-status--progress {
  font-family: "Open Sans", sans-serif;
  color: #17384c;
  font-weight: bold;
  font-size: 13px;
  display: flex;
  align-items: center;
}
.export-status--warning {
  font-weight: 600;
  font-size: 0.95em;
  opacity: 0.85;
}
.export-status--warning md-icon path {
  fill: #FF9615;
}
.export-status__progress-icon {
  margin-right: 8px;
}
.export-status__progress-icon path {
  stroke: #17384c;
}

.export-details__desc {
  font-size: 14px;
}

.export-sample {
  font-size: 12px;
}
.export-sample__title {
  color: #232d33;
  text-transform: uppercase;
}
.export-sample__value {
  font-family: "Menlo", "monospace", "Open Sans";
  background-color: rgb(246, 248, 250);
  color: #17384c;
  padding: 18px 22px 22px 22px;
  white-space: pre;
  overflow: auto;
}

.export-table tr:hover {
  cursor: default !important;
}

.export-details {
  max-width: 700px;
  margin: 0 auto;
}
.export-details .description-text {
  font-size: 0.95em;
  opacity: 0.85;
  margin-top: 12px;
  margin-bottom: 0;
}
.export-details .description-text.error {
  color: rgba(207, 37, 43, 0.8);
}
.export-details .description-text.warning {
  font-weight: 600;
  margin-bottom: -5px;
}
.export-details .description-text.warning md-icon path {
  fill: #FF9615;
}
.export-details .export-type-container .header-text {
  font-weight: 600;
  font-size: 15px;
  margin-bottom: 12px;
}
.export-details .export-type-container .document-icon {
  min-width: 30px;
  min-height: 30px;
  transform: scale(1.2);
  margin: 8px 6px 8px 2px;
}
.export-details .export-type-container .export-tabs {
  display: inline-flex;
  flex-wrap: wrap;
  align-self: flex-start;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  gap: 20px;
  margin-top: 16px;
  margin-bottom: 20px;
}
.export-details .export-type-container .export-tabs__label {
  font-size: 12px;
  opacity: 0.7;
  padding: 0 4px 0 6px;
}
.export-details .export-type-container .export-tabs .format {
  font-size: 0.9em;
  opacity: 0.7;
  font-weight: 600;
}
.export-details .export-type-container .export-tabs__button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-align: left;
  position: relative;
  flex: 1;
  outline: none;
  margin: 0;
  font-weight: 600;
  font-size: 13px;
  min-width: 170px;
  height: 54px;
  color: #15394C;
  border: none;
  background: none;
  border-radius: 8px;
  padding: 8px 0 8px 44px;
  transition: 0.2s ease-out all;
  border: 1px solid rgba(218, 220, 232, 0.8);
}
.export-details .export-type-container .export-tabs__button:hover {
  border: 1px solid rgba(75, 158, 252, 0.65);
  background-color: rgba(248, 252, 255, 0.5);
}
.export-details .export-type-container .export-tabs__button:focus {
  background-color: rgba(255, 255, 255, 0);
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 1px rgba(60, 66, 88, 0.12), 0px 3px 8px -2px rgba(60, 66, 88, 0.1);
}
.export-details .export-type-container .export-tabs__button.export-tabs__button--selected {
  border: 1px solid rgba(75, 158, 250, 0.8);
  background-color: rgb(248, 252, 255);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15);
}
.export-details .export-type-container .export-tabs__button.export-tabs__button--selected .checkmark {
  background-color: rgba(75, 158, 250, 0.9);
  border: 1px solid rgb(75, 158, 250);
}
.export-details .export-type-container .export-tabs__button .checkmark {
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  left: 16px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1px solid rgba(218, 220, 232, 0.7);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.export-details .export-type-container .export-tabs__button .checkmark::before {
  content: "";
  position: absolute;
  width: 2px;
  height: 7px;
  background-color: #fff;
  left: 7px;
  top: 3px;
}
.export-details .export-type-container .export-tabs__button .checkmark::after {
  content: "";
  position: absolute;
  width: 3px;
  height: 2px;
  background-color: #fff;
  left: 4px;
  top: 8px;
}
.export-details .export-container {
  border-radius: 6px;
}
.export-details .export-container .input-container {
  margin-right: 16px;
  width: fit-content;
}
.export-details .export-container .input-container .input-element {
  height: 30px;
  line-height: 30px;
  width: calc(100% - 14px);
  padding: 0 14px 0 12px;
}
.export-details .export-container .input-container .input-element__icon-left {
  width: calc(100% - 33px);
  padding: 0 14px 0 32px;
}
.export-details .export-container .input-container .input-element.no-border-right {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.export-details .export-container .input-container .input-element.no-border-left {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: -1px;
}
.export-details .export-container .input-container .input-element.no-border {
  border-radius: 0;
}
.export-details .export-container .input-container .input-element.no-border-bottom {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.export-details .export-container .input-container .input-element.no-border-top {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.export-details .export-container .input-container .input-icon {
  bottom: 7px;
}
.export-details .export-container .input-container .input-icon__start {
  left: 8px;
  right: auto;
}
.export-details .export-container .input-container .input-icon__start path {
  fill: #15394C;
}
.export-details .export-container .input-container .input-icon__end {
  right: -8px;
}
.export-details .export-container .icon-button {
  line-height: 32px;
  height: 32px;
  min-height: 32px;
  width: fit-content;
  min-width: 64px;
}
.export-details .export-container .icon-button.middle-button {
  border-radius: 0;
}
.export-details .export-container .icon-button.end-button {
  border-radius: 0 5px 5px 0;
}
.export-details .export-container .icon-button .md-datepicker-input {
  display: none;
}
.export-details .export-container .section {
  display: flex;
  flex-direction: column;
  border-top: 1px solid rgba(218, 220, 232, 0.7);
  padding: 24px;
}
.export-details .export-container .section .section-caption {
  opacity: 0.85;
  font-size: 0.95em;
  font-weight: 600;
  margin-top: 0;
  margin-bottom: 8px;
}
.export-details .export-container .section .section-caption .select-all {
  font-size: 0.88em;
  opacity: 0.8;
  text-decoration: underline;
  margin-left: 4px;
  cursor: pointer;
}
.export-details .export-container .section .clickable-header {
  cursor: pointer;
}
.export-details .export-container .section .clickable-header:hover {
  opacity: 0.8;
  transition: 0.2s ease-out opacity;
}
.export-details .export-container .section.no-border-top {
  border-top: none;
}
.export-details .export-container .section__export-type {
  border-top: none;
  padding-bottom: 16px;
}
.export-details .export-container .section__date-range {
  border-top: none;
  flex-direction: row;
  align-items: flex-end;
  flex-wrap: wrap;
  padding-top: 16px;
}
.export-details .export-container .section__date-range .label {
  margin-top: 6px;
}
.export-details .export-container .section__devices {
  padding: 0;
  flex-direction: row;
}
.export-details .export-container .section__devices .split-view {
  padding: 24px;
  display: flex;
  flex: 2;
  flex-direction: column;
}
.export-details .export-container .section__devices .split-view md-radio-group {
  font-weight: 600;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16px;
}
.export-details .export-container .section__devices .split-view md-radio-group md-radio-button {
  margin-bottom: 0;
}
.export-details .export-container .section__devices .split-view.right-side {
  border-left: 1px solid rgba(218, 220, 232, 0.6);
}
.export-details .export-container .section__devices .split-view .faded {
  opacity: 0.8;
}
.export-details .export-container .section__devices .split-view.devices {
  padding: 0;
  position: relative;
  height: 260px;
  overflow: hidden;
}
.export-details .export-container .section__devices .split-view.devices .devices-list {
  display: flex;
  flex-direction: column;
  flex: 2;
  overflow-y: scroll;
  position: absolute;
  top: 36px;
  bottom: 28px;
  left: 0;
  right: 0;
}
.export-details .export-container .section__devices .split-view.devices .device-row {
  display: flex;
  flex-direction: row;
  width: 100%;
  border-top: 1px solid rgba(218, 220, 232, 0.4);
}
.export-details .export-container .section__devices .split-view.devices .device-row.header {
  height: 36px;
  border-top: 0;
  background-color: rgb(246, 248, 250);
  display: flex;
  align-items: center;
  font-weight: 600;
}
.export-details .export-container .section__devices .split-view.devices .device-row.header.faded {
  border-bottom: 1px solid rgba(218, 220, 232, 0.4);
}
.export-details .export-container .section__devices .split-view.devices .device-row:last-of-type {
  border-bottom: 1px solid rgba(218, 220, 232, 0.4);
}
.export-details .export-container .section__devices .split-view.devices .device-row {
  cursor: pointer;
}
.export-details .export-container .section__devices .split-view.devices .device-row:hover .item.disable-option md-icon {
  opacity: 1 !important;
}
.export-details .export-container .section__devices .split-view.devices .device-row .item {
  flex: 1;
  font-size: 0.92em;
  padding: 7px 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.export-details .export-container .section__devices .split-view.devices .device-row .item.border-left {
  border-left: 1px solid rgba(218, 220, 232, 0.6);
}
.export-details .export-container .section__devices .split-view.devices .device-row .item.disable-option {
  display: flex;
  justify-content: space-between;
}
.export-details .export-container .section__devices .split-view.devices .device-row .item.disable-option md-icon {
  opacity: 0.3;
  margin-right: 0;
  transition: 0.25s ease-out;
}
.export-details .export-container .section__devices .split-view.devices .footer {
  border-top: 1px solid rgba(218, 220, 232, 0.6);
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgb(246, 248, 250);
  height: 28px;
  bottom: 0;
  width: 100%;
  text-align: center;
  font-weight: 600;
  font-size: 0.95em;
}
.export-details .export-container .section__labels {
  padding: 16px 20px 12px 20px;
}
.export-details .export-container .section__aggregated {
  padding: 0;
  display: flex;
  flex-direction: row;
}
.export-details .export-container .section__aggregated .aggregation {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
}
.export-details .export-container .section__preview {
  position: relative;
}
.export-details .export-container .section__preview .download-container {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
}
.export-details .export-container .section__preview .export-preview {
  display: flex;
  flex-direction: row;
}
.export-details .export-container .section__preview .export-preview .table {
  overflow-x: scroll;
  display: flex;
  flex-direction: row;
  border-radius: 5px;
  border-left: 1px solid rgba(218, 220, 232, 0.6);
  border-right: 1px solid rgba(218, 220, 232, 0.6);
}
.export-details .export-container .section__preview .export-preview .table .column {
  max-width: 240px;
  border: 1px solid rgba(218, 220, 232, 0.6);
  border-right: 0;
}
.export-details .export-container .section__preview .export-preview .table .column .header {
  max-height: 36px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  background-color: rgb(246, 248, 250);
  padding: 8px;
  font-weight: 600;
  font-size: 0.88em;
}
.export-details .export-container .section__preview .export-preview .table .column .entry {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  border-top: 1px solid rgba(218, 220, 232, 0.5);
  font-size: 0.85em;
  padding: 6px 8px;
  opacity: 0.85;
}
.export-details .export-container .section__preview .export-preview .table .column .entry.more-rows {
  opacity: 0.65;
  text-align: left;
  min-height: 15px;
}
.export-details .export-container .section__preview .fade-left-side {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 20px;
  background-image: linear-gradient(90deg, white, transparent);
}
.export-details .export-container .section__preview .fade-right-side {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 40px;
  background-image: linear-gradient(90deg, transparent, white);
}
.export-details .export-container md-checkbox .md-label {
  margin-left: 28px;
  font-weight: 600;
  font-size: 0.98em;
}
.export-details .export-container .options-container.event-options {
  display: grid;
  grid-template-columns: repeat(auto-fill, 180px);
  grid-auto-rows: 30px;
}
.export-details .export-container .options-container.event-options .grid-item {
  display: flex;
  align-items: flex-start;
}
.export-details .export-container .options-container.event-options .grid-item .copyable-value {
  font-weight: 400;
  padding: 2px 6px;
  margin-left: 1px;
}

.md-datepicker-input-mask {
  display: none;
}

.md-datepicker-calendar-pane.md-pane-open {
  box-shadow: 0 0 0 1px rgb(218, 220, 232), 0 15px 35px 0 rgba(49, 49, 93, 0.1), 0 5px 15px 0 rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  overflow: hidden;
}

.md-calendar-day-header {
  background-color: rgb(246, 248, 250);
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
}
.md-calendar-day-header th {
  font-weight: 600;
}

.md-calendar-date-today .md-calendar-date-selection-indicator {
  border: none !important;
}

.md-calendar-date-selection-indicator {
  border-radius: 0px;
  box-shadow: 0 0 0 1px rgb(218, 220, 232);
  width: 43px;
  height: 43px;
  line-height: 43px;
}

.export-spacer {
  width: 100%;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.export-spacer .line {
  width: 2px;
  background-color: #d0d1d9;
  height: 100%;
}
.export-spacer .line.active {
  background-color: rgba(75, 158, 252, 0.65);
}

.alerts .sticky-header {
  display: flex;
  flex-direction: row;
  position: sticky;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  top: 0;
  z-index: 3;
  padding: 12px 28px;
  background-color: rgba(239, 241, 245, 0.5);
  border-bottom: 1px solid rgba(239, 241, 245, 0.9);
  backdrop-filter: blur(3px);
}
@media (max-width: 735px) {
  .alerts .sticky-header {
    align-items: start;
    padding: 6px 14px;
    top: 60px;
  }
}
.alerts .sticky-header .segmented-control {
  display: flex;
  flex-direction: row;
}
.alerts .sticky-header .segmented-control .separator {
  width: 1px;
  background-color: rgba(0, 0, 0, 0.1);
}
.alerts .sticky-header .segmented-control__item {
  background-color: rgba(239, 241, 245, 0.5);
  padding: 8px 20px;
  box-shadow: 0px 0px 0px 1px #dadce8;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 6px;
}
.alerts .sticky-header .segmented-control__item.left {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.alerts .sticky-header .segmented-control__item.right {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
.alerts .sticky-header .segmented-control__item.active {
  background-color: white;
  font-weight: 600;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
  z-index: 1;
}
.alerts .sticky-header .segmented-control__item .tab-icon {
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
}
.alerts .sticky-header .right-side-buttons {
  display: flex;
  flex-direction: row;
  gap: 0px;
}
.alerts .sticky-header .right-side-buttons .icon-button {
  min-width: 40px;
}
.alerts active-alerts {
  display: flex;
  flex-direction: column;
  gap: 24px;
  flex: 1;
}
@media (max-width: 735px) {
  .alerts active-alerts {
    padding: 14px;
  }
}
.alerts alert-log {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.alerts alert-log .container {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
@media (max-width: 735px) {
  .alerts alert-log .container {
    padding: 0 14px;
  }
}
.alerts alert-log .toolbar {
  display: flex;
  flex-direction: row;
  gap: 12px;
  margin-top: 20px;
}
@media (max-width: 735px) {
  .alerts alert-log .toolbar {
    flex-direction: column;
  }
}
.alerts alert-log .toolbar .input-container.search {
  min-width: 300px;
}
@media (max-width: 735px) {
  .alerts alert-log .toolbar .filter-button-container {
    margin-left: auto;
  }
}
.alerts alert-log .toolbar #alertFilterButton {
  margin-left: 0;
}
.alerts alert-log .toolbar #alertFilterButton.with-clear-button {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-right: -3px;
}
.alerts alert-log .toolbar .clear-button {
  min-width: 60px;
}
.alerts alert-log .alerts-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.alerts alert-log .alerts-summary .total {
  margin-top: -1px;
  display: flex;
  background-color: rgba(255, 255, 255, 0);
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px 12px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 6px;
  font-weight: 600;
}
.alerts alert-log .alerts-summary .total span {
  display: flex;
  align-items: center;
  text-align: center;
}
.alerts alert-log .alerts-summary .total:hover {
  cursor: pointer;
  box-shadow: 0 2px 4px -3px rgba(0, 0, 0, 0.168627451);
  background-color: white;
}
.alerts alert-log .alerts-summary .total.active {
  background-color: white;
}
.alerts alert-log .alerts-summary .rule {
  display: flex;
  background-color: rgba(255, 255, 255, 0);
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 6px;
  font-weight: 400;
  transition: 0.15s ease all;
}
.alerts alert-log .alerts-summary .rule:hover {
  cursor: pointer;
  box-shadow: 0 2px 4px -3px rgba(0, 0, 0, 0.168627451);
  background-color: white;
}
.alerts alert-log .alerts-summary .rule.active {
  font-weight: 600;
  border: 1px solid rgba(75, 158, 250, 0.8);
  background-color: rgb(248, 252, 255);
  box-shadow: 0 2px 4px -3px rgba(0, 0, 0, 0.168627451);
}
.alerts alert-log .alerts-summary .rule .rule-alert-count {
  opacity: 1;
  border-right: 1px solid #dadce8;
  padding-right: 6px;
  font-weight: 600;
}

.alert-log-timeline-dialog {
  width: 80vw;
  max-width: 1400px;
  overflow: visible;
}
.alert-log-timeline-dialog .content-box {
  border: none;
}
.alert-log-timeline-dialog .content-box .timeline {
  min-height: 350px;
  max-height: 350px;
}
.alert-log-timeline-dialog .content-box .graph-section {
  height: 276px !important;
}

.alert-day-header {
  font-weight: 600;
  font-size: 14px;
  margin-left: 6px;
  margin-top: 4px;
}
.alert-day-header .number-of-alerts {
  border-left: 2px solid rgb(218, 220, 232);
  opacity: 0.7;
  padding-left: 8px;
  margin-left: 6px;
  font-size: 13px;
}

.alerts-stats-section {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
  border-radius: 10px;
  transition: all 0.2s ease-out;
}
@media (max-width: 735px) {
  .alerts-stats-section {
    display: none;
  }
}
.alerts-stats-section .stats-section-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 6px;
}
.alerts-stats-section .stats-section-header .title {
  font-weight: 600;
  margin-bottom: 12px;
}
.alerts-stats-section .stats-section-header .color-description {
  display: flex;
  flex-direction: row;
  gap: 2px;
  align-items: center;
  justify-content: space-between;
  height: fit-content;
}
.alerts-stats-section .stats-section-header .color-description .color {
  width: 6px;
  height: 8px;
  border-radius: 1px;
}
.alerts-stats-section .stats-section-header .color-description .color.green {
  background-color: rgb(66, 167, 66);
}
.alerts-stats-section .stats-section-header .color-description .color.orange {
  background-color: #E3AA5B;
}
.alerts-stats-section .stats-section-header .color-description .color.red {
  background-color: #c95d3f;
}
.alerts-stats-section .stats-section-header .color-description .popover {
  min-width: 130px;
}
.alerts-stats-section .stats-section-header .color-description .popover .color-item {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-content: center;
  align-items: center;
}
.alerts-stats-section .color-timeline {
  display: flex;
  flex-direction: row;
  gap: 2px;
}
.alerts-stats-section .color-timeline .info-hint {
  display: contents;
}
.alerts-stats-section .color-timeline .timeline-day {
  position: relative;
  height: 22px;
  min-width: 5px;
  flex: 1;
  border-radius: 1px;
  background-color: rgb(66, 167, 66);
  transition: all 0.1s ease-out;
}
.alerts-stats-section .color-timeline .timeline-day.gray {
  background-color: #cbced0;
}
.alerts-stats-section .color-timeline .timeline-day.green {
  background-color: rgb(66, 167, 66);
}
.alerts-stats-section .color-timeline .timeline-day.orange {
  background-color: #E3AA5B;
}
.alerts-stats-section .color-timeline .timeline-day.red {
  background-color: #c95d3f;
}
.alerts-stats-section .color-timeline .timeline-day:hover {
  transform: scale(1.08) translateY(-2px);
  z-index: 100;
}
.alerts-stats-section .color-timeline .timeline-day .popover {
  transition: none;
  margin-bottom: 36px;
  font-size: 13px;
}
.alerts-stats-section .color-timeline .timeline-day .popover .alerts-container {
  max-height: 90px;
  overflow: scroll;
  background-color: #f6f8fa;
  border: 1px solid rgba(218, 220, 232, 0.3);
  padding: 6px 8px;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.alerts-stats-section .color-timeline .timeline-day .popover .alerts-container .alert-item {
  font-weight: 600;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.alerts-stats-section .color-timeline .timeline-day .popover .alerts-container .alert-item md-icon {
  width: 13px;
  height: 13px;
  min-width: 13px;
  min-height: 13px;
  margin: 0;
}
.alerts-stats-section .color-timeline .timeline-day .popover .alerts-container .alert-item:hover {
  text-decoration: underline;
  cursor: pointer;
}
.alerts-stats-section .timeline-description {
  margin-top: 12px;
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  color: rgba(21, 57, 76, 0.7);
  font-size: 12px;
}
.alerts-stats-section .timeline-description .line {
  flex: 1;
  height: 1px;
  background-color: rgba(218, 220, 232, 0.5);
}
.alerts-stats-section .trends-container {
  display: flex;
  min-width: 440px;
  min-height: 115px;
  flex: 1;
  padding: 0;
}
.alerts-stats-section .trends-container .header {
  flex-direction: column;
  justify-content: flex-start;
  margin-top: 12px;
  margin-left: 16px;
  margin-right: 16px;
}
.alerts-stats-section .trends-container .separator {
  width: 1px;
  background-color: rgba(218, 220, 232, 0.5);
  height: 100%;
}
.alerts-stats-section .trends-container .trend-section {
  display: flex;
  flex-direction: column;
  flex: 1;
  position: relative;
}
.alerts-stats-section .trends-container .trend-section .header {
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
}
.alerts-stats-section .trends-container .trend-section .highcharts-plot-background {
  fill: transparent;
}
.alerts-stats-section .trends-container .trend-section .highcharts-background {
  fill: transparent;
}
.alerts-stats-section .trends-container .trend-section .highcharts-grid-line {
  stroke-width: 1;
}
.alerts-stats-section .trends-container .trend-section .highcharts-axis-line {
  stroke: rgba(218, 220, 232, 0.4);
}
.alerts-stats-section .trends-container .trend-section .trend-graph {
  height: 74px;
  display: flex;
  overflow: hidden;
  width: 100%;
  position: absolute;
  bottom: 0;
}

.alert-popover-options {
  position: absolute;
  right: 8px;
  top: 8px;
  min-width: 180px;
  background-color: white;
  z-index: 5;
  padding: 0 !important;
  display: block;
  transition: opacity ease-in-out 0.2s;
}
@media (max-width: 735px) {
  .alert-popover-options {
    border-radius: 8px;
    border: 1px solid rgb(218, 220, 232);
  }
}
.alert-popover-options .option {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  margin: 7px;
  padding: 10px;
  padding-top: 8px;
  padding-bottom: 8px;
  border-radius: 4px;
  transition: all ease-in-out 0.15s;
  cursor: pointer;
  outline: none;
  opacity: 0.8;
  font-weight: 600;
}
.alert-popover-options .option:not(.delete):hover {
  background-color: rgba(218, 220, 232, 0.4);
  opacity: 1;
}
.alert-popover-options .option:not(.delete):hover .icon {
  color: rgba(21, 57, 76, 0.9);
}
.alert-popover-options .option.delete:hover {
  background-color: rgb(255, 236, 239);
  color: rgb(253, 61, 91);
  opacity: 1;
}
.alert-popover-options .option.delete:hover .icon {
  color: rgb(253, 61, 91);
}
.alert-popover-options .option .icon {
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
  margin-right: 8px;
  margin-left: 0;
  color: rgba(21, 57, 76, 0.7);
}
.alert-popover-options .option .text {
  margin: 0;
}
.alert-popover-options .option.disabled {
  pointer-events: none;
  opacity: 0.7;
}
.alert-popover-options .separator {
  width: 100%;
  height: 1px;
  background-color: rgba(218, 220, 232, 0.5);
}

.alerts-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid rgb(218, 220, 232);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
  background-color: white;
  border-radius: 8px;
}
.alerts-list .grid-section {
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
}
.alerts-list .grid-section:last-child {
  border-bottom: none;
  margin-bottom: 0;
}
.alerts-list .grid-container {
  display: grid;
  position: relative;
  grid-template-columns: 1.2fr 0fr 0.7fr 0fr 0.6fr 0fr auto;
  grid-gap: 0;
  align-items: center;
  border-radius: 5px;
}
@media (max-width: 735px) {
  .alerts-list .grid-container {
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: start;
  }
}
.alerts-list .grid-container.archived {
  opacity: 0.8;
  background-color: rgba(211, 211, 211, 0.1882352941);
}
.alerts-list .grid-container.archived .title-and-trigger {
  text-decoration: line-through;
  text-decoration-color: rgba(0, 0, 0, 0.3);
}
.alerts-list .separator {
  width: 1px;
  background-color: rgba(218, 220, 232, 0.8);
  height: 100%;
}
.alerts-list .item {
  padding: 12px 14px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}
.alerts-list .item .device-button {
  margin-left: 0;
  display: flex;
  flex: 1;
  min-width: 100px;
  max-width: 400px;
  justify-content: flex-start;
  align-items: center;
}
.alerts-list .item .device-button .icon-button__text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.alerts-list .item .device-button md-icon {
  margin: 0 0 0 auto;
}
.alerts-list .item .device-button md-icon path {
  transform: translateY(0);
}
.alerts-list .item.description {
  grid-column: 1;
  text-align: left;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
  gap: 8px;
}
@media (max-width: 735px) {
  .alerts-list .item.description {
    flex-direction: column;
    align-items: start;
    gap: 12px;
  }
}
.alerts-list .item.description .row {
  display: flex;
  gap: 10px;
}
.alerts-list .item.description .row .icon-button .graph {
  width: 21px;
  height: 21px;
  min-width: 21px;
  min-height: 21px;
}
.alerts-list .item.description .row .icon-button .graph path {
  fill: none;
}
.alerts-list .item.description .row.device-and-timeline {
  min-width: 200px;
}
@media (max-width: 735px) {
  .alerts-list .item.description .row.device-and-timeline {
    flex-direction: row-reverse;
  }
}
.alerts-list .item.description .user-interactions {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  font-size: 12px;
  line-height: 11px;
  gap: 4px;
  padding: 3px 5px;
  border-radius: 4px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  background-color: rgba(218, 220, 232, 0.3);
  opacity: 0.7;
  color: #73664A;
}
.alerts-list .item.description .user-interactions.has-interactions {
  opacity: 1;
  border: 1px solid #EACE85;
  background-color: #F4E1B0;
}
.alerts-list .item.description .user-interactions .comment-icon {
  width: 12px;
  height: 12px;
  min-width: 12px;
  min-height: 12px;
}
.alerts-list .item.description .user-interactions .comment-icon path {
  fill: none;
  transform: none;
}
.alerts-list .item.resolved {
  grid-column: 3;
  text-align: left;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
}
@media (max-width: 735px) {
  .alerts-list .item.resolved {
    padding: 0px 14px 14px 14px;
  }
}
.alerts-list .item.resolved .divider {
  height: 0px;
  width: 100%;
  border-bottom: 1px dashed rgba(218, 220, 232, 0.6);
}
.alerts-list .item.resolved .ack-ca-indicators {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex: 1;
  gap: 10px;
}
.alerts-list .item.resolved .ack-ca-indicators .ack-ca-state {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 1px solid rgba(218, 220, 232, 0.8);
  display: flex;
  margin-top: 1px;
}
.alerts-list .item.resolved .ack-ca-indicators .ack-ca-state.active {
  border: 1px solid green;
  background-color: rgba(0, 128, 0, 0.201);
}
.alerts-list .item.resolved .icon {
  width: 24px;
  min-width: 24px;
  height: 24px;
  border: 1px solid rgb(218, 220, 232);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.alerts-list .item.resolved .icon.alert-open {
  background-color: rgba(220, 114, 74, 0.06);
  border-color: #DC724A;
}
.alerts-list .item.resolved .icon.alert-ack {
  background-color: #EFF1F5;
  border-color: rgba(21, 57, 76, 0.2);
}
.alerts-list .item.resolved .icon.alert-corrective-action {
  background-color: rgba(115, 166, 223, 0.06);
  border-color: #73A6DF;
}
.alerts-list .item.resolved .icon md-icon {
  width: 14px;
  height: 14px;
  min-height: 14px;
  min-width: 14px;
}
.alerts-list .item.actions {
  grid-column: 5;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: start;
  flex: 1;
  padding: 0;
  text-align: left;
}
@media (max-width: 735px) {
  .alerts-list .item.actions {
    width: 100%;
    flex-direction: row;
  }
}
.alerts-list .item.actions .divider {
  height: 0px;
  width: 100%;
  border-bottom: 1px dashed rgba(218, 220, 232, 0.7);
}
@media (max-width: 735px) {
  .alerts-list .item.actions .divider {
    display: none;
  }
}
.alerts-list .item.actions .acknowledged {
  padding: 7px 10px;
  display: flex;
  flex-direction: row;
  align-items: center;
  align-self: normal;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.alerts-list .item.actions .corrective-action {
  padding: 7px 10px;
  display: flex;
  flex-direction: row;
  align-items: center;
  align-self: normal;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.alerts-list .item.actions .ack-ca-state {
  min-width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1px solid rgba(218, 220, 232, 0.8);
  display: flex;
  margin-top: 1px;
}
.alerts-list .item.actions .ack-ca-state.active {
  border: 1px solid green;
  background-color: rgba(0, 128, 0, 0.5);
}
.alerts-list .item.actions .state-text {
  opacity: 0.75;
}
.alerts-list .item.actions .state-text.active {
  opacity: 1;
  font-weight: 600;
}
.alerts-list .item.options {
  grid-column: 7;
}
@media (max-width: 735px) {
  .alerts-list .item.options {
    display: none;
  }
}

.active-alert {
  display: flex;
  padding: 0 !important;
  position: relative;
  color: #15394C;
}
@media (max-width: 735px) {
  .active-alert {
    flex-direction: column-reverse;
    border: 1px solid #dadce8 !important;
    border-radius: 8px !important;
    box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
  }
}
.active-alert .timeline {
  width: 280px;
  min-height: 260px;
  max-height: 260px;
  overflow: scroll;
  border-right: 1px solid rgb(218, 220, 232);
  padding: 16px;
  display: flex;
  flex-direction: column;
  flex-direction: column-reverse;
  justify-items: flex-end;
}
@media (max-width: 735px) {
  .active-alert .timeline {
    border-right: none;
    min-height: fit-content;
    max-height: fit-content;
    width: auto;
  }
}
.active-alert .timeline .event {
  flex-direction: row;
  display: flex;
}
.active-alert .timeline .event .left-side {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.active-alert .timeline .event .left-side .icon {
  width: 26px;
  height: 26px;
  border: 1px solid rgb(218, 220, 232);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.active-alert .timeline .event .left-side .icon.alert-delay {
  border-style: dashed;
}
.active-alert .timeline .event .left-side .icon.alert-open {
  background-color: rgba(220, 114, 74, 0.06);
  border-color: #DC724A;
}
.active-alert .timeline .event .left-side .icon.alert-ack {
  background-color: #EFF1F5;
  border-color: rgba(21, 57, 76, 0.2);
}
.active-alert .timeline .event .left-side .icon.alert-comment {
  background-color: rgba(234, 206, 133, 0.06);
  border-color: #EACE85;
}
.active-alert .timeline .event .left-side .icon.alert-corrective-action {
  background-color: rgba(115, 166, 223, 0.06);
  border-color: #73A6DF;
}
.active-alert .timeline .event .left-side .icon.alert-resolved {
  background-color: rgba(134, 182, 139, 0.06);
  border-color: #86B68B;
}
.active-alert .timeline .event .left-side .icon.alert-archived {
  background-color: rgba(143, 143, 143, 0.06);
  border-color: #8F8F8F;
}
.active-alert .timeline .event .left-side .icon md-icon {
  width: 14px;
  height: 14px;
  min-height: 14px;
  min-width: 14px;
}
.active-alert .timeline .event .left-side .loader {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: linear-gradient(0deg, rgba(115, 166, 223, 0.2) 33%, #73A6DF 100%);
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
}
.active-alert .timeline .event .left-side .loader.escalation {
  background: linear-gradient(0deg, rgba(234, 133, 95, 0.2) 33%, #EA855F 100%);
}
.active-alert .timeline .event .left-side .loader.escalation .loader-center {
  background-color: #EA855F;
}
.active-alert .timeline .event .left-side .loader .loader-center {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #73A6DF;
  z-index: 1;
}
.active-alert .timeline .event .left-side .loader::after {
  content: "";
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: white;
}
@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.active-alert .timeline .event .left-side .line {
  width: 1px;
  background-color: rgb(218, 220, 232);
  flex: 1;
}
.active-alert .timeline .event .left-side .line.delay-line {
  width: 0;
  border-left: 1px dashed rgb(218, 220, 232);
  background-color: transparent;
}
.active-alert .timeline .event .left-side.escalation .line {
  flex: none;
  height: 20px;
}
.active-alert .timeline .event .right-side {
  display: flex;
  flex-direction: column;
  flex: 1;
  cursor: default;
  padding: 6px 10px;
  margin-top: -8px;
  margin-left: 2px;
  margin-bottom: 6px;
  border: 1px solid transparent;
}
.active-alert .timeline .event .right-side.hoverable:hover {
  background-color: rgba(218, 220, 232, 0.2);
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 6px;
}
.active-alert .timeline .event .right-side.hoverable:hover .info-icon {
  opacity: 0.7;
}
.active-alert .timeline .event .right-side.escalation {
  padding: 22px 12px 10px 12px;
}
.active-alert .timeline .event .right-side .type {
  font-weight: 600;
  font-size: 0.98em;
}
.active-alert .timeline .event .right-side .time {
  opacity: 0.85;
  font-size: 0.96em;
}
.active-alert .timeline .event .right-side .message {
  opacity: 0.9;
  font-size: 12px;
  margin-top: 4px;
  padding: 6px 10px;
  border-radius: 5px;
}
.active-alert .timeline .event .right-side .message.info {
  background-color: rgba(218, 220, 232, 0.2);
  border: 1px solid rgb(218, 220, 232);
}
.active-alert .timeline .event .right-side .message.error {
  background-color: rgba(236, 82, 51, 0.1);
  border: 1px solid #f38f76;
}
.active-alert .timeline .event .right-side .message.notification {
  background-color: #FBF7EE;
  border: 1px solid #EACE85;
}
.active-alert .timeline .event .right-side .message.comment {
  background-color: rgb(251, 246, 239);
  border: 1px solid #f0e6cd;
  color: #302817;
}
.active-alert .timeline .event .right-side .message .title {
  font-weight: 600;
}
.active-alert .timeline .user-actions {
  display: flex;
  flex-wrap: wrap;
  background-color: rgba(218, 220, 232, 0.2);
  border: 1px solid rgb(218, 220, 232);
  border-radius: 8px;
  padding: 10px;
  transition: all 0.2s ease-out;
}
.active-alert .timeline .user-actions__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex: 1;
}
.active-alert .timeline .user-actions__input {
  display: flex;
  flex: 1;
  flex-direction: column;
}
.active-alert .timeline .user-actions__input-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex: 1;
  gap: 8px;
  justify-content: space-between;
  font-weight: 600;
  padding-left: 4px;
}
.active-alert .timeline .user-actions__input-header-buttons {
  display: flex;
  flex-direction: row;
  gap: 8px;
  transform: scale(0.95);
}
.active-alert .timeline .user-actions .unack-info {
  font-size: 0.9em;
  opacity: 0.9;
  text-align: center;
  margin: 0;
}
.active-alert .timeline .resolved-summary {
  text-align: center;
  border-top: 1px dashed rgba(218, 220, 232, 0.6);
  margin-top: 10px;
  padding-top: 10px;
}
.active-alert .timeline .alert-tags-box {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.active-alert .timeline .alert-tags-box .alert-tags-picker__input-row {
  display: flex;
  gap: 6px;
  align-items: center;
}
.active-alert .timeline .alert-tags-box .alert-tags-picker__input {
  flex: 1;
  border: 1px solid rgba(218, 220, 232, 0.9);
  border-radius: 6px;
  padding: 5px 8px;
  font-size: 13px;
  outline: none;
}
.active-alert .timeline .alert-tags-box .alert-tags-picker__input:focus {
  border-color: rgba(21, 57, 76, 0.3);
}
.active-alert .timeline .alert-tags-box .alert-tags-picker__presets {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}
.active-alert .timeline .alert-tags-box .alert-tags-picker__preset {
  font-size: 12px;
  padding: 3px 10px;
  border-radius: 10px;
  border: 1px solid rgba(21, 57, 76, 0.12);
  background: #fff;
  color: #1c3144;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.active-alert .timeline .alert-tags-box .alert-tags-picker__preset:hover {
  background: rgba(21, 57, 76, 0.06);
}
.active-alert .timeline .alert-tags-box .alert-tags-picker__preset:disabled {
  opacity: 0.4;
  cursor: default;
}
.active-alert .timeline .alert-tags-box .alert-tags-picker__preset--active {
  background: #EC6A3E;
  color: #fff;
  border-color: #EC6A3E;
}
.active-alert .timeline .alert-tags-box .alert-tags-picker__preset--active:hover {
  background: #d95a30;
}
.active-alert .details {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.active-alert .details .info-row {
  min-height: 38px;
  display: flex;
  flex-direction: row;
  padding: 10px 12px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgb(218, 220, 232);
}
@media (max-width: 735px) {
  .active-alert .details .info-row {
    flex-wrap: wrap;
    height: fit-content;
    gap: 12px;
  }
}
.active-alert .details .info-row .left-side {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}
.active-alert .details .info-row .left-side .description {
  display: flex;
  flex-direction: column;
  line-height: 16px;
}
.active-alert .details .info-row .left-side .description .title-and-trigger {
  display: flex;
  flex-direction: column;
}
.active-alert .details .info-row .left-side .description .title-and-trigger .title {
  font-weight: 600;
}
.active-alert .details .info-row .left-side .description .title-and-trigger .trigger {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  flex-wrap: wrap;
}
.active-alert .details .info-row .right-side {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
}
.active-alert .details .info-row .right-side .sensor-button {
  min-width: 120px;
  max-width: 160px;
  text-overflow: ellipsis;
}
.active-alert .details .graph-section {
  display: flex;
  height: 176px;
  margin: 12px;
  padding: 10px;
  background-color: #FBFBFD;
  border: 1px solid #EDEDED;
  border-radius: 6px;
}
.active-alert .details .graph-section .highcharts-container {
  overflow: visible;
}
.active-alert .details .graph-section .highcharts-plot-background, .active-alert .details .graph-section .highcharts-background {
  fill: transparent;
}
.highcharts-plot-band .active-alert .details .graph-section.highcharts-pane {
  fill-opacity: 0;
}
.active-alert .details .graph-section .highcharts-plot-band--missing-data {
  fill-opacity: 1;
}
.active-alert .details .graph-section .highcharts-plot-band.trigger-delay {
  fill: rgba(252, 232, 223, 0.3);
  fill-opacity: 1;
}
.active-alert .details .graph-section .highcharts-plot-band.trigger-delay:hover {
  fill: rgba(252, 232, 223, 0.4);
}
.active-alert .details .graph-section .highcharts-plot-band.pre-trigger-overlay {
  fill: rgba(251, 251, 253, 0.5);
  fill-opacity: 1;
  z-index: 7;
}
.active-alert .details .graph-section .highcharts-plot-band.resolve-overlay {
  fill: rgba(251, 251, 253, 0.5);
  fill-opacity: 1;
  z-index: 7;
}
.active-alert .details .graph-section .highcharts-plot-band.period-overlay {
  fill: rgba(248, 203, 166, 0.2);
  fill-opacity: 1;
}
.active-alert .details .graph-section .delay-label {
  display: flex;
  align-items: center;
  gap: 2px;
}
.active-alert .details .graph-section .highcharts-plot-line.threshold {
  stroke: rgba(255, 80, 60, 0.7);
  stroke-width: 2px;
  z-index: 1;
  filter: drop-shadow(0px 2px 2px rgba(164, 16, 16, 0.2));
}
.active-alert .details .graph-section .highcharts-plot-line.trigger-delay-start {
  stroke: rgba(234, 18, 18, 0.25);
  stroke-width: 1px;
  stroke-dasharray: 4;
  z-index: 1;
  filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.2));
}
.active-alert .details .graph-section .highcharts-plot-line.trigger-actual {
  stroke: rgba(234, 18, 18, 0.3);
  stroke-width: 2px;
  z-index: 1;
  filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.2));
}
.active-alert .details .graph-section .highcharts-plot-line.resolve-actual {
  stroke: rgba(134, 182, 139, 0.8);
  stroke-width: 2px;
  z-index: 1;
  filter: drop-shadow(0 0 2px rgba(134, 182, 139, 0.3));
}
.active-alert .details .graph-section .highcharts-plot-line-label.resolve-actual-label, .active-alert .details .graph-section .highcharts-plot-line-label.trigger-actual-label {
  transform: rotate(0deg) !important;
  transform-origin: center !important;
  opacity: 1;
}
.active-alert .details .graph-section .highcharts-yaxis-grid .highcharts-grid-line {
  stroke-width: 1px;
  z-index: 0;
}
.active-alert .details .graph-section .highcharts-plot-line-label {
  font-weight: 600;
  opacity: 0.8;
}
.active-alert .event-popover {
  width: 100px;
  overflow-wrap: break-word;
  position: absolute;
  z-index: 10;
  opacity: 1;
  display: block;
  box-shadow: 0 0 0 1px rgb(218, 220, 232), 0 15px 35px 0 rgba(49, 49, 93, 0.1), 0 5px 15px 0 rgba(0, 0, 0, 0.08);
  background-color: #fff;
  border-radius: 8px;
  min-width: 340px;
  padding: 16px;
  transition: opacity 0.2s ease-out, margin 0.2s ease-out, transform 0.2s ease-out;
  margin-left: -16px;
  transform: scale(1);
}
@media (max-width: 735px) {
  .active-alert .event-popover {
    min-width: calc(100vw - 48px);
    margin: 0 auto;
  }
}
.active-alert .event-popover.hidden {
  transition: none;
  opacity: 0;
  margin-left: -10px;
  transform: scale(0.98);
  pointer-events: none;
}
@media (max-width: 735px) {
  .active-alert .event-popover::before {
    display: none;
  }
}
.active-alert .event-popover::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: #fff;
  transform: rotate(45deg);
  border-left: 1px solid rgb(218, 220, 232);
  border-bottom: 1px solid rgb(218, 220, 232);
  border-radius: 0px 0 0 4px;
  position: absolute;
  left: -10px;
  top: calc(50% - 8px);
}
.active-alert .event-popover .header-description {
  opacity: 0.7;
  margin-bottom: 8px;
}
.active-alert .event-popover .notification-wrapper {
  border: 1px solid rgba(251, 167, 21, 0.3921568627);
  padding: 12px;
  border-radius: 6px;
  background-color: rgba(250, 245, 236, 0.3882352941);
  box-shadow: 0 4px 8px -4px rgba(86, 57, 4, 0.0784313725);
}
.active-alert .event-popover .popover-header {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
}
.active-alert .event-popover .popover-header .logo {
  opacity: 0.7;
  margin: 0 0 0 4px;
  width: 20px;
  min-width: 20px;
  border-radius: 6px;
  padding: 6px 8px;
  color: #ffffff;
  border: 1px solid;
  box-shadow: 0 2px 8px -3px;
}
.active-alert .event-popover .popover-header .logo-service-channel {
  background-color: rgb(82, 183, 228);
  padding: 6px 8px 4px 8px;
  border-color: #288aa9;
  box-shadow: 0 2px 8px -3px #4391bd;
}
.active-alert .event-popover .popover-header .logo-corrigo {
  background-color: rgb(235, 136, 55);
  padding: 10px 8px 10px 8px;
  border-color: rgb(193, 110, 41);
  box-shadow: 0 2px 8px -3px rgb(235, 136, 55);
}
.active-alert .event-popover .popover-header .logo-webhook {
  background-color: #232d33;
  border-color: #171e21;
  box-shadow: 0 2px 8px -3px #232d33;
}
.active-alert .event-popover .popover-header .logo-webhook path {
  fill: #ffffff;
}
.active-alert .event-popover .popover-header .logo-phone {
  background-color: #2b8330;
  border-color: #217025;
  box-shadow: 0 2px 8px -3px #2b8330;
}
.active-alert .event-popover .popover-header .logo-phone.failure {
  opacity: 0.9;
  background-color: #d94d45;
  border-color: #b53e37;
  box-shadow: 0 2px 8px -3px #d94d45;
}
.active-alert .event-popover .popover-header .logo-phone path {
  animation: ring 4s 0.7s ease-in-out infinite;
  transform-origin: 30% 70%;
  fill: #ffffff !important;
  fill-opacity: 1 !important;
}
@keyframes ring {
  0% {
    -webkit-transform: rotateZ(0);
  }
  1% {
    -webkit-transform: rotateZ(10deg);
  }
  3% {
    -webkit-transform: rotateZ(-8deg);
  }
  5% {
    -webkit-transform: rotateZ(10deg);
  }
  7% {
    -webkit-transform: rotateZ(-8deg);
  }
  9% {
    -webkit-transform: rotateZ(6deg);
  }
  11% {
    -webkit-transform: rotateZ(-5deg);
  }
  13% {
    -webkit-transform: rotateZ(4deg);
  }
  15% {
    -webkit-transform: rotateZ(-3deg);
  }
  17% {
    -webkit-transform: rotateZ(2deg);
  }
  19% {
    -webkit-transform: rotateZ(-1deg);
  }
  21% {
    -webkit-transform: rotateZ(1deg);
  }
  23% {
    -webkit-transform: rotateZ(-0.5deg);
  }
  25% {
    -webkit-transform: rotateZ(0.5deg);
  }
  27% {
    -webkit-transform: rotateZ(-0.3deg);
  }
  29% {
    -webkit-transform: rotateZ(0.2deg);
  }
  31% {
    -webkit-transform: rotateZ(-0.1deg);
  }
  33% {
    -webkit-transform: rotateZ(0.05deg);
  }
  35% {
    -webkit-transform: rotateZ(-0.03deg);
  }
  37% {
    -webkit-transform: rotateZ(0.02deg);
  }
  39% {
    -webkit-transform: rotateZ(-0.01deg);
  }
  41% {
    -webkit-transform: rotateZ(0);
  }
  100% {
    -webkit-transform: rotateZ(0);
  }
}
.active-alert .event-popover .popover-description {
  opacity: 0.9;
  padding: 8px 0;
}
.active-alert .event-popover .table-wrapper {
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 6px;
  overflow: hidden;
  background-color: #f6f8fa;
}
.active-alert .event-popover .table-wrapper .table-field:not(:last-child) {
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
}
.active-alert .event-popover .table-wrapper .table-field {
  display: flex;
  flex-direction: row;
}
.active-alert .event-popover .table-wrapper .table-field-name {
  display: flex;
  padding: 6px 10px;
  font-weight: 600;
  min-width: 110px;
  border-right: 1px solid rgba(218, 220, 232, 0.5);
}
.active-alert .event-popover .table-wrapper .table-field-value {
  display: flex;
  flex: 1;
  padding: 6px 10px;
  overflow-x: scroll;
}

.alert-guide-dialog {
  width: 70vw;
  max-width: 720px;
  padding: 24px;
  color: #15394C;
}
.alert-guide-dialog .title {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 0;
}
@media (max-width: 735px) {
  .alert-guide-dialog .title {
    padding: 0 12px;
  }
}
@media (max-width: 735px) {
  .alert-guide-dialog .body-container {
    padding: 12px;
  }
}
.alert-guide-dialog .body-container .text-body {
  line-height: 1.5;
  margin: 10px 0;
}
.alert-guide-dialog .body-container .alert-flow-container {
  display: flex;
}
.alert-guide-dialog .body-container .alert-flow-container .arrow-container {
  display: flex;
  flex-direction: column;
  margin-right: 20px;
  align-items: center;
  margin: 10px 10px 20px 4px;
}
.alert-guide-dialog .body-container .alert-flow-container .arrow-container .arrow {
  width: 2px;
  border-top-left-radius: 1px;
  border-top-right-radius: 1px;
  flex: 1;
  background-color: #D9D9D9;
  display: flex;
}
.alert-guide-dialog .body-container .alert-flow-container .alert-flow {
  list-style: none; /* Remove default bullet points */
  padding: 0;
  margin: 4px 0 10px 10px;
}
.alert-guide-dialog .body-container .alert-flow-container .alert-flow li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 8px;
}
@media (max-width: 735px) {
  .alert-guide-dialog .body-container .alert-flow-container .alert-flow li {
    display: flex;
    flex-direction: column;
  }
}
.alert-guide-dialog .body-container .alert-flow-container .alert-flow li svg {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  margin-top: 2px;
}

.checkmark-wrapper {
  margin-top: 40px;
}
.checkmark-wrapper .checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 0;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: #679f5d;
  fill: none;
  opacity: 0;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}
.checkmark-wrapper .checkmark {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: block;
  stroke-width: 4px;
  stroke: #fff;
  stroke-miterlimit: 10;
  margin: 10% auto;
  box-shadow: inset 0px 0px 0px #679f5d;
  animation: fill 0.3s ease-in-out 0.3s forwards, scale 0.2s ease-in-out 0.6s both;
}
.checkmark-wrapper .checkmark__check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  animation: stroke 0.2s cubic-bezier(0.65, 0, 0.45, 1) 0.6s forwards;
}
@keyframes stroke {
  100% {
    opacity: 1;
    stroke-dashoffset: 0;
  }
}
@keyframes scale {
  0%, 100% {
    transform: none;
  }
  50% {
    transform: scale3d(1.1, 1.1, 1);
  }
}
@keyframes fill {
  100% {
    box-shadow: inset 0px 0px 0px 30px #679f5d;
  }
}

.filter-checkbox {
  min-height: 30px;
}
.filter-checkbox .md-label {
  margin-left: 30px;
}
.filter-checkbox .md-icon::after {
  transition: 0.2s all cubic-bezier(0.22, 1, 0.36, 1);
}
.filter-checkbox.no-active-options .md-icon {
  opacity: 0.8;
}
.filter-checkbox.no-active-options .md-icon::after {
  opacity: 0.8;
  width: 0;
  transform: rotate(90deg);
  left: 5px;
  top: 2px;
  height: 8px;
}

@media (max-width: 735px) {
  .rules-detail-view {
    width: 100%;
  }
}

.rules {
  margin: 0 auto;
  max-width: 800px;
  margin-bottom: 100px;
}
.rules .content-box .divider {
  width: 100%;
  height: 1px;
  border-top: 1px solid rgba(218, 220, 232, 0.5);
}
.rules .content-box .clickable-header {
  font-weight: 600;
  cursor: pointer;
}
.rules .content-box .clickable-header:hover {
  opacity: 0.8;
  transition: 0.2s ease-out opacity;
}
.rules .content-box .preview {
  margin-top: 18px;
}
.rules .content-box .preview-section {
  display: flex;
  flex-direction: column;
  position: relative;
  min-height: 220px;
  padding: 4px 16px 0px 16px;
  background-color: rgba(218, 220, 232, 0.1);
  border: 1px dashed rgba(218, 220, 232, 0.8);
  border-radius: 5px;
}
.rules .content-box .preview-section .preview-empty-state {
  display: flex;
  flex-grow: 1;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  text-align: center;
}
.rules .content-box .preview-section .highcharts-plot-background, .rules .content-box .preview-section .highcharts-background {
  fill: transparent;
}
.rules .content-box .preview-section .highcharts-plot-band {
  fill: transparent;
}
.rules .content-box .preview-section .highcharts-plot-line.threshold {
  stroke: rgba(255, 80, 60, 0.6);
  stroke-width: 2px;
}
.rules .content-box .preview-section .highcharts-plot-line-label {
  font-weight: 600;
  opacity: 0.8;
}
.rules .content-box .preview-section .chart-zoom-controls {
  margin-top: 0;
}
.rules .content-box.device-list .mode-selection-container {
  display: flex;
  align-items: start;
  gap: 24px;
  flex-wrap: wrap;
}
.rules .content-box.device-list .mode-selection-container.bottom-aligned {
  align-items: end;
  gap: 16px;
}
.rules .state-buttons {
  position: fixed;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-grow: 1;
  bottom: 24px;
  right: 24px;
  padding: 0;
  padding-left: 16px;
  padding-right: 16px;
  background-color: rgba(255, 255, 255, 0.7);
  z-index: 5;
  height: 70px;
}
@media (max-width: 735px) {
  .rules .state-buttons {
    bottom: 12px;
    right: 12px;
    border-left: 1px solid rgb(218, 220, 232);
    border-right: 1px solid rgb(218, 220, 232);
    border-radius: 8px;
  }
}
.rules .state-buttons .separator {
  margin-left: 16px;
  margin-right: 16px;
  height: 100%;
  width: 1px;
  background-color: rgb(218, 220, 232);
}
.rules .heading {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding-top: 0;
  padding-bottom: 0;
  height: 80px;
}
.rules .heading .name {
  padding: 14px;
  flex-grow: 1;
  outline: none;
  color: #15394C;
  font-size: 14px;
  font-weight: bold;
  border-radius: 6px;
  box-shadow: 0 1px 4px -2px rgba(20, 40, 60, 0.2);
}
.rules .heading .name.trigger-set.ng-empty {
  border: 1px solid rgba(207, 37, 43, 0.5);
}
@media (max-width: 735px) {
  .rules .heading .name {
    border: 1px solid rgb(218, 220, 232);
  }
}
.rules .heading .rule-name {
  flex-grow: 1;
  margin-bottom: 0;
}
.rules .heading .separator {
  margin-left: 24px;
  margin-right: 24px;
  height: 80px;
  width: 1px;
  background-color: rgb(218, 220, 232);
}
@media (max-width: 735px) {
  .rules .heading .separator {
    margin-left: 12px;
    margin-right: 12px;
    width: 0px;
  }
}
.rules .heading .rule-switch {
  display: flex;
  flex-direction: row;
  align-items: center;
}
@media (max-width: 735px) {
  .rules .heading .rule-switch {
    margin-right: 16px;
  }
}
.rules .heading .rule-switch .switch-text {
  margin-right: 12px;
  font-size: 14px;
  font-weight: bold;
  width: 60px;
  text-align: right;
}
.rules .disabled {
  pointer-events: none;
  opacity: 0.7;
}
.rules .heading, .rules .trigger, .rules .schedule, .rules .trigger-delay, .rules .action, .rules .device-list {
  position: relative;
}
@media (min-width: 960px) {
  .rules .heading.content-box, .rules .trigger.content-box, .rules .schedule.content-box, .rules .trigger-delay.content-box, .rules .action.content-box, .rules .device-list.content-box {
    padding: 20px;
    transition: 0.2s all ease-in-out;
  }
  .rules .heading.content-box:hover, .rules .heading.content-box.active, .rules .trigger.content-box:hover, .rules .trigger.content-box.active, .rules .schedule.content-box:hover, .rules .schedule.content-box.active, .rules .trigger-delay.content-box:hover, .rules .trigger-delay.content-box.active, .rules .action.content-box:hover, .rules .action.content-box.active, .rules .device-list.content-box:hover, .rules .device-list.content-box.active {
    border: 1px solid rgba(75, 158, 252, 0.65);
    box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 1px 2px 6px -2px rgba(20, 60, 100, 0.16), 6px 12px 28px -10px rgba(70, 100, 130, 0.22) !important;
  }
}
.rules .heading.ng-animate, .rules .trigger.ng-animate, .rules .schedule.ng-animate, .rules .trigger-delay.ng-animate, .rules .action.ng-animate, .rules .device-list.ng-animate {
  transition: 0s all ease-in-out;
}
.rules .heading .info-container, .rules .trigger .info-container, .rules .schedule .info-container, .rules .trigger-delay .info-container, .rules .action .info-container, .rules .device-list .info-container {
  display: flex;
  flex-direction: column;
  background-color: #f6f9fc;
  border: 1px solid rgba(218, 220, 232, 0.8);
  padding: 16px;
  border-radius: 5px;
}
.rules .heading .info-container .info-heading, .rules .trigger .info-container .info-heading, .rules .schedule .info-container .info-heading, .rules .trigger-delay .info-container .info-heading, .rules .action .info-container .info-heading, .rules .device-list .info-container .info-heading {
  margin-top: 0px;
  margin-bottom: 12px;
  font-size: 14px;
  font-weight: 600;
}
.rules .heading .info-container .alert-container, .rules .trigger .info-container .alert-container, .rules .schedule .info-container .alert-container, .rules .trigger-delay .info-container .alert-container, .rules .action .info-container .alert-container, .rules .device-list .info-container .alert-container {
  display: flex;
  flex-direction: row;
  color: #15394C;
}
.rules .heading .info-container .alert-container .alert-title, .rules .trigger .info-container .alert-container .alert-title, .rules .schedule .info-container .alert-container .alert-title, .rules .trigger-delay .info-container .alert-container .alert-title, .rules .action .info-container .alert-container .alert-title, .rules .device-list .info-container .alert-container .alert-title {
  margin-top: 10px;
  margin-bottom: 0;
  font-weight: 600;
  outline: none;
  cursor: pointer;
}
.rules .heading .info-container .alert-container .alert-description, .rules .trigger .info-container .alert-container .alert-description, .rules .schedule .info-container .alert-container .alert-description, .rules .trigger-delay .info-container .alert-container .alert-description, .rules .action .info-container .alert-container .alert-description, .rules .device-list .info-container .alert-container .alert-description {
  margin-top: 2px;
  margin-bottom: 4px;
  font-size: 12px;
  color: rgba(21, 57, 76, 0.8);
}
.rules .heading .info-container .alert-container .alert-description .link-icon, .rules .trigger .info-container .alert-container .alert-description .link-icon, .rules .schedule .info-container .alert-container .alert-description .link-icon, .rules .trigger-delay .info-container .alert-container .alert-description .link-icon, .rules .action .info-container .alert-container .alert-description .link-icon, .rules .device-list .info-container .alert-container .alert-description .link-icon {
  height: 12px;
  min-height: 12px;
  width: 12px;
  min-width: 12px;
}
.rules .heading .remove-button, .rules .trigger .remove-button, .rules .schedule .remove-button, .rules .trigger-delay .remove-button, .rules .action .remove-button, .rules .device-list .remove-button {
  position: absolute;
  top: 12px;
  right: 12px;
  background-color: white;
  width: 26px;
  height: 26px;
  border-radius: 4px;
  transition: 0.2s all;
  cursor: pointer;
  outline: none;
}
.rules .heading .remove-button:hover, .rules .trigger .remove-button:hover, .rules .schedule .remove-button:hover, .rules .trigger-delay .remove-button:hover, .rules .action .remove-button:hover, .rules .device-list .remove-button:hover {
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 1px rgba(60, 66, 88, 0.18), 0px 3px 6px 0px rgba(60, 66, 88, 0.12);
}
.rules .heading .remove-button .close-icon, .rules .trigger .remove-button .close-icon, .rules .schedule .remove-button .close-icon, .rules .trigger-delay .remove-button .close-icon, .rules .action .remove-button .close-icon, .rules .device-list .remove-button .close-icon {
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
}
.rules .heading .helper-text, .rules .trigger .helper-text, .rules .schedule .helper-text, .rules .trigger-delay .helper-text, .rules .action .helper-text, .rules .device-list .helper-text {
  margin-bottom: 0;
  margin-left: 4px;
  opacity: 0.7;
}
.rules .heading .helper-text-error, .rules .trigger .helper-text-error, .rules .schedule .helper-text-error, .rules .trigger-delay .helper-text-error, .rules .action .helper-text-error, .rules .device-list .helper-text-error {
  color: rgba(207, 37, 43, 0.8);
  opacity: 1;
}
.rules .heading .border-top, .rules .trigger .border-top, .rules .schedule .border-top, .rules .trigger-delay .border-top, .rules .action .border-top, .rules .device-list .border-top {
  border-top: 1px solid rgba(218, 220, 232, 0.6);
}
.rules .heading .notification-option, .rules .trigger .notification-option, .rules .schedule .notification-option, .rules .trigger-delay .notification-option, .rules .action .notification-option, .rules .device-list .notification-option {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.rules .heading .notification-option .option-text .option-title, .rules .trigger .notification-option .option-text .option-title, .rules .schedule .notification-option .option-text .option-title, .rules .trigger-delay .notification-option .option-text .option-title, .rules .action .notification-option .option-text .option-title, .rules .device-list .notification-option .option-text .option-title {
  margin: 0;
  font-weight: 600;
}
.rules .heading .notification-option .option-text .option-description, .rules .trigger .notification-option .option-text .option-description, .rules .schedule .notification-option .option-text .option-description, .rules .trigger-delay .notification-option .option-text .option-description, .rules .action .notification-option .option-text .option-description, .rules .device-list .notification-option .option-text .option-description {
  margin: 0;
  opacity: 0.7;
}
.rules .heading .notification-option.ack-duration, .rules .trigger .notification-option.ack-duration, .rules .schedule .notification-option.ack-duration, .rules .trigger-delay .notification-option.ack-duration, .rules .action .notification-option.ack-duration, .rules .device-list .notification-option.ack-duration {
  padding: 10px 12px 12px 12px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  background-color: #f6f9fc;
  border-radius: 6px;
}
.rules .heading .notification-option label input:disabled ~ span, .rules .trigger .notification-option label input:disabled ~ span, .rules .schedule .notification-option label input:disabled ~ span, .rules .trigger-delay .notification-option label input:disabled ~ span, .rules .action .notification-option label input:disabled ~ span, .rules .device-list .notification-option label input:disabled ~ span {
  opacity: 0.3;
  cursor: default;
}
.rules .trigger .trigger-container {
  flex-wrap: wrap;
}
.rules .schedule .timezone {
  position: absolute;
  display: flex;
  top: 12px;
  right: 42px;
  gap: 8px;
  background-color: white;
  padding: 0 8px;
  height: 26px;
  border-radius: 4px;
  transition: 0.2s all;
  cursor: pointer;
  outline: none;
  user-select: none;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 1px rgba(60, 66, 88, 0.18), 0px 3px 6px 0px rgba(60, 66, 88, 0.12);
}
.rules .schedule .timezone:hover:not(.no-options) {
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 1px rgba(60, 66, 88, 0.18), 0px 3px 6px 0px rgba(60, 66, 88, 0.12);
}
.rules .schedule .timezone .option {
  opacity: 0.5;
  line-height: 26px;
}
.rules .schedule .timezone .selected {
  font-weight: 600;
  opacity: 1;
}
.rules .schedule .day-label {
  align-self: center;
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}
.rules .spacer {
  width: 100%;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rules .spacer .line {
  width: 2px;
  background-color: #d0d1d9;
  height: 100%;
}
.rules .spacer .line.active {
  background-color: rgba(75, 158, 252, 0.65);
}
.rules .info-box {
  background-color: #f0f2f3;
  margin: 16px 0px;
  padding: 3px 16px;
}
.rules .actions-and-escalation-container .escalation-wrapper.show-wrapper {
  border-radius: 10px;
  background-color: rgba(255, 166, 0, 0.1176470588);
  border: 1px solid rgba(255, 165, 0, 0.8);
  box-shadow: 0px 6px 22px -10px rgba(194, 85, 2, 0.2509803922);
  overflow: hidden;
}
.rules .actions-and-escalation-container .escalation-wrapper.show-wrapper .escalation-header {
  padding: 16px;
  border-bottom: 1px solid rgba(255, 165, 0, 0.8);
  background-color: rgba(255, 165, 0, 0.231372549);
}
.rules .actions-and-escalation-container .escalation-wrapper.show-wrapper .escalation-header .description {
  padding-left: 4px;
  margin-bottom: 16px;
  text-align: left;
  font-weight: 600;
  color: #573f13;
}
.rules .actions-and-escalation-container .escalation-wrapper.show-wrapper .escalation-header .input-and-delete {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.rules .actions-and-escalation-container .escalation-wrapper.show-wrapper .escalation-header .input-and-delete .md-icon-button {
  height: 26px;
  padding: 0;
  border-left: 1px solid rgba(194, 85, 2, 0.2509803922);
  width: 46px;
  margin-left: 16px;
  border-radius: 0;
}
.rules .actions-and-escalation-container .escalation-wrapper.show-wrapper .actions {
  padding: 24px;
}
.rules .actions-and-escalation-container .escalation-delay {
  max-width: 200px;
  padding: 0;
  margin: 0 auto;
  background-color: rgba(255, 255, 255, 0.6);
  overflow: hidden;
}
.rules .actions-and-escalation-container .escalation-delay .header {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
  border-bottom: 1px solid rgba(218, 220, 232, 0.6);
  padding: 10px 14px;
  background-color: white;
}
.rules .actions-and-escalation-container .escalation-delay .header md-icon {
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
}
.rules .actions-and-escalation-container .escalation-delay .content {
  padding: 10px 14px 14px 14px;
}
.rules .actions {
  display: flex;
  flex-direction: column;
}
.rules .actions .action-list .action {
  margin: 0 auto;
}
.rules .actions .action-list .action .action-header {
  background-color: #f6f9fc;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 6px;
}
.rules .actions .action-list .action .action-header h3 {
  font-weight: 600;
}
.rules .actions .action-list .action .action-header .action-header-content, .rules .actions .action-list .action .action-header .action-header-content > * {
  margin-left: 8px;
  margin-right: 8px;
}
.rules .actions .action-list .action .action-content.info-container .input-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16px;
}
.rules .actions .action-list .action .action-content.info-container .input-container {
  min-width: 150px;
}
.rules .actions .action-list .action .action-content .signal-tower-empty-state {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px;
  margin: 0;
  border-radius: 6px;
  border: 1px dashed rgba(218, 220, 232, 0.8);
  background-color: rgba(218, 220, 232, 0.1);
  align-items: center;
  text-align: center;
  font-weight: 600;
}
.rules .actions .action-list .action .action-content .dt-chips .md-chips {
  display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
}
.rules .actions .action-list .action .action-content .dt-chips .md-chips .md-chip-input-container {
  flex-grow: 1;
}
.rules .actions .action-list .action .action-content .dt-chips .md-chips .md-chip-input-container input {
  width: 100%;
}
.rules .actions .action-list .action .action-content .dt-chips.ng-invalid.ng-dirty .md-chips {
  box-shadow: 0 0 0 transparent inset, 0 1px 0 0 #cf252b !important;
}
.rules .actions .action-list .action .action-content .dt-chips.ng-invalid.ng-dirty .md-chips.md-focused {
  box-shadow: 0 0 0 transparent inset, 0 1px 0 0 #cf252b;
}
.rules .actions .action-list .action .action-content .dynamic-input-container {
  display: flex;
  flex-direction: column;
  pointer-events: all !important;
}
.rules .actions .action-list .action .action-content .dynamic-input-container .header {
  margin-top: 0;
  font-size: 13px;
}
.rules .actions .action-list .action .action-content .dynamic-input-container .dynamic-inputs {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.rules .actions .action-list .action .action-content .dynamic-input-container .dynamic-inputs .icon-button {
  min-width: 0;
  margin-left: 0;
  margin-right: 12px;
  margin-bottom: 8px;
  height: 28px;
  padding: 4px 8px 4px 8px;
  line-height: unset;
  min-height: unset;
}
.rules .actions .action-list .action .action-content .dynamic-input-container .dynamic-inputs .icon-button .dynamic-input {
  font-weight: 400;
  margin: 0;
}
.rules .actions .action-list .action .action-content .dynamic-input-container .dynamic-inputs .icon-button .dynamic-input .prefix {
  color: rgb(20, 120, 200);
}
.rules .actions .action-list .action .action-content .md-chips-messages {
  color: #cf252b;
}
.rules .actions .action-list .action .action-content .md-chips-messages > * {
  padding-top: 5px;
  padding-right: 5px;
}
.rules .button-description {
  text-align: center;
  opacity: 0.6;
  font-size: 14px;
}
.rules .input-container .label-with-hint {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 4px;
}

.duration-input {
  position: relative;
}
.duration-input .duration-input-errors {
  position: absolute;
  top: 51px;
  color: #cf252b;
  font-size: 12px;
}

.emulator-state-status {
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  font-weight: bold;
  color: #737678;
}
.emulator-state-status--enabled {
  color: #57802f;
}
.emulator-state-status--system-disabled {
  color: #cf252b;
}
.emulator-state .block-title, .emulator-state .popover-preferences__subtitle {
  font-size: 12px;
}
.emulator-state__value.state-block__value--main {
  font-size: 19px;
}
@media (max-width: 735px) {
  .emulator-state__value {
    line-height: 1.2;
  }
}
.emulator-state__icon {
  padding: 10px;
  position: relative;
}
.emulator-state__time, .emulator-state__type {
  font-size: 12px;
  color: #17384c;
}
.emulator-state__details {
  text-transform: uppercase;
  font-weight: bold;
  line-height: 24px;
  color: #207da9;
}
.emulator-state__details md-icon {
  vertical-align: top;
}
.emulator-state__labels .dt-chips.dt-chips--editing md-chips-wrap {
  background-color: transparent;
}

.emulator-details .humidity-variants {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.emulator-details .humidity-variants .variant {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  background-color: #eff1f5;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 8px;
  height: 140px;
  opacity: 0.7;
}
.emulator-details .humidity-variants .variant:hover {
  cursor: pointer;
  opacity: 1;
}
.emulator-details .humidity-variants .variant.active {
  border: 1px solid rgb(75, 158, 250);
  opacity: 1;
}

.emulator-controller .icon-button {
  margin-left: 0;
  margin-right: 8px;
}
.emulator-controller .type-label {
  font-weight: 600;
}

.emulator-details-type-select md-select-menu, .emulator-details-type-select md-select-menu md-content {
  max-height: none;
}

.emulator-details-type {
  font-size: 12px;
  color: #17384c;
}

.emulator-details-control {
  border-radius: 2px;
  margin-bottom: 48px;
  padding: 12px 16px;
  flex-direction: column;
}
@media (min-width: 1180px) {
  .emulator-details-control {
    flex-direction: row;
  }
}
.emulator-details-control__state {
  display: flex;
}
@media (max-width: 1179px) {
  .emulator-details-control__state {
    margin-bottom: 16px;
  }
}
@media (min-width: 1180px) {
  .emulator-details-control__state {
    width: 50%;
  }
}
.emulator-details-control__metrics {
  flex-grow: 1;
}
@media (max-width: 1365px) {
  .emulator-details-control__metric-widgets {
    display: flex;
    justify-content: space-between;
  }
}
.emulator-details-control .metrics-refresh-button {
  margin: -1px 0 0 8px;
}
.emulator-details-control .metrics-refresh-button md-icon {
  position: relative;
  bottom: 2px;
}
.emulator-details-control__action-title {
  display: flex;
}
.emulator-details-control__current {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 2px;
  background-color: rgba(87, 128, 47, 0.05);
  padding: 12px;
  flex-grow: 1;
}
.emulator-details-control__switch {
  flex-grow: 3;
  color: #207da9;
  margin-top: 8px;
}

.md-button[disabled].proximity-state {
  background-color: #3e4a4f;
  opacity: 1;
  color: white;
}

.md-button[disabled].motion-state {
  background-color: #3e4a4f;
  opacity: 1;
  color: white;
}

.dashboard-container {
  height: 100vh;
  overflow-y: scroll;
  padding-left: 8px;
  padding-right: 8px;
  position: relative;
}
@media (max-width: 735px) {
  .dashboard-container {
    height: calc(100vh - 46px);
  }
}
@media (min-width: 736px) and (max-width: 959px) {
  .dashboard-container {
    height: calc(100vh - 60px);
  }
}
.dashboard-container.fullscreen {
  height: 100vh;
}
@media (max-width: 735px) {
  .dashboard-container {
    padding: 0;
  }
}

.dashboard-buttons {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  position: sticky;
  justify-content: space-between;
  gap: 8px;
  top: 0;
  margin-left: -8px;
  margin-right: -8px;
  padding: 28px 28px 16px 28px;
  z-index: 3;
  background-color: rgba(239, 241, 245, 0.5);
  border-bottom: 1px solid rgba(239, 241, 245, 0.9);
  backdrop-filter: blur(3px);
}
.dashboard-buttons__left-side {
  display: flex;
}
.dashboard-buttons__left-side .input-element {
  padding: 0 14px 0 12px;
}
.dashboard-buttons__left-side .input-element .display-name {
  max-width: 240px;
  margin-right: 20px;
  padding-right: 10px;
  display: block;
}
.dashboard-buttons__left-side .input-dropdown {
  max-height: 70vh;
  overflow-y: auto;
}
.dashboard-buttons__left-side .input-dropdown .item {
  display: flex;
  align-content: center;
  font-weight: 600;
  opacity: 0.9;
}
.dashboard-buttons__left-side .input-dropdown .item__blurred {
  opacity: 0.7;
  filter: blur(1px);
  pointer-events: none;
}
.dashboard-buttons__left-side .input-dropdown .item.renaming:hover {
  background-color: transparent;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard {
  justify-content: space-between;
  align-items: center;
  padding: 0;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard .left-side {
  width: 100%;
  padding: 8px 10px;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard .right-side-options {
  padding: 8px 10px;
  display: flex;
  position: relative;
  border-radius: 4px;
  height: 36px;
  width: 80px;
  align-items: center;
  justify-content: flex-end;
  cursor: pointer;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard .right-side-options:hover .options {
  opacity: 1;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard .right-side-options:hover .dots {
  opacity: 0;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard .right-side-options .options {
  display: flex;
  flex-direction: row;
  opacity: 0;
  transition: 0.2s all ease-in-out;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard .right-side-options .options .rename-option {
  padding: 4px 2px;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard .right-side-options .options .delete-option {
  padding: 4px 2px;
  margin-right: 0;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard .right-side-options .dots {
  display: flex;
  position: absolute;
  right: 16px;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  height: 15px;
  transition: 0.2s all ease-in-out;
}
.dashboard-buttons__left-side .input-dropdown .item.existing-dashboard .right-side-options .dots .dot {
  border-radius: 50%;
  width: 3px;
  height: 3px;
  background-color: #15394C;
  opacity: 0.7;
}
.dashboard-buttons__left-side .input-dropdown .dashboard-input-button {
  display: flex;
  flex-direction: row;
  padding: 7px 8px;
}
.dashboard-buttons__left-side .input-dropdown .dashboard-input-button .input-element {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  z-index: 1;
}
.dashboard-buttons__left-side .input-dropdown .dashboard-input-button .icon-button {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: 1px;
  min-width: 74px;
  margin-right: 0;
}
.dashboard-buttons__right-side {
  align-items: flex-end;
  display: flex;
}
.dashboard-buttons__right-side .timezone {
  display: flex;
  flex-direction: column;
  margin-left: 12px;
  margin-right: 6px;
}
.dashboard-buttons__right-side .timezone .label {
  opacity: 0.65;
  margin-top: 0;
  margin-bottom: 4px;
  font-size: 0.95em;
}
.dashboard-buttons__right-side .timezone .timezone-value {
  display: flex;
  align-items: center;
  background-color: rgba(255, 255, 255, 0.5);
  box-shadow: 0 0 0 1px rgb(218, 220, 232);
  border-radius: 5px;
  padding: 0px 10px;
  height: 34px;
  font-weight: 600;
}
.dashboard-buttons__right-side .timezone .timezone-value md-icon {
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  margin-right: 8px;
}
.dashboard-buttons__right-side .time-picker {
  display: flex;
  align-items: flex-end;
}
.dashboard-buttons__right-side .time-picker .icon-button {
  line-height: 32px;
  height: 34px;
  min-height: 34px;
  width: fit-content;
  min-width: 64px;
}
.dashboard-buttons__right-side .time-picker .icon-button.middle-button {
  border-radius: 0;
}
.dashboard-buttons__right-side .time-picker .icon-button.end-button {
  border-radius: 0 5px 5px 0;
}
.dashboard-buttons__right-side .time-picker .icon-button .md-datepicker-input {
  display: none;
}
.dashboard-buttons__right-side .time-picker .input-container {
  margin-right: 16px;
  width: fit-content;
}
.dashboard-buttons__right-side .time-picker .input-container .input-element {
  height: 32px;
  line-height: 32px;
  width: calc(100% - 14px);
  padding: 0 14px 0 12px;
}
.dashboard-buttons__right-side .time-picker .input-container .input-element__icon-left {
  width: calc(100% - 33px);
  padding: 0 14px 0 32px;
}
.dashboard-buttons__right-side .time-picker .input-container .input-element.no-border-right {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.dashboard-buttons__right-side .time-picker .input-container .input-element.no-border-left {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: -1px;
}
.dashboard-buttons__right-side .time-picker .input-container .input-element.no-border {
  border-radius: 0;
}
.dashboard-buttons__right-side .time-picker .input-container .input-element.no-border-bottom {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.dashboard-buttons__right-side .time-picker .input-container .input-element.no-border-top {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.dashboard-buttons__right-side .time-picker .input-container .input-icon {
  bottom: 7px;
}
.dashboard-buttons__right-side .time-picker .input-container .input-icon__start {
  left: 8px;
  right: auto;
}
.dashboard-buttons__right-side .time-picker .input-container .input-icon__start path {
  fill: #15394C;
}
.dashboard-buttons__right-side .time-picker .input-container .input-icon__end {
  right: -8px;
}
.dashboard-buttons__right-side.fullscreen {
  top: 36px;
}
@media (max-width: 735px) {
  .dashboard-buttons__right-side {
    float: none;
    justify-content: flex-start;
    top: 14px;
    position: sticky;
  }
}
.dashboard-buttons__right-side .zoom-button {
  margin-right: 12px;
  transition: all ease-in-out 0.3s;
}
@media (max-width: 735px) {
  .dashboard-buttons__right-side .zoom-button {
    max-height: 42px;
  }
}
.dashboard-buttons__right-side .icon-button.md-button {
  min-width: 42px;
}
.dashboard-buttons__right-side .icon-button md-icon.smaller-icon {
  height: 20px;
  width: 20px;
  min-height: 20px;
  min-width: 20px;
}
.dashboard-buttons__right-side .icon-button md-icon path {
  fill: rgba(21, 57, 76, 0.85);
}
@media (max-width: 735px) {
  .dashboard-buttons__right-side .create-card-button {
    max-height: 42px;
  }
}

.empty-dashboard {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  transition: 0.3s all ease-in-out;
}
.empty-dashboard.adjust-margin-top {
  margin-top: -100px;
}
.empty-dashboard .empty-boxes {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 200px;
  height: 150px;
  margin-bottom: 12px;
  transition: 0.5s all ease-in-out;
}
.empty-dashboard .empty-boxes .empty-box {
  transition: 0.25s all ease-in-out;
  width: 40%;
  margin: 6px;
  padding: 0;
  animation-duration: 4s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: normal;
}
@media (max-width: 735px) {
  .empty-dashboard .empty-boxes .empty-box {
    border-radius: 8px;
    border: 1px solid rgb(218, 220, 232);
  }
}
.empty-dashboard .empty-boxes .empty-box:hover {
  transform: scale(1.06);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 1px 4px 6px -2px rgba(20, 60, 100, 0.15), 3px 14px 20px -6px rgba(70, 100, 130, 0.2) !important;
  border: 1px solid rgba(75, 158, 252, 0.55);
}
.empty-dashboard .empty-boxes .animate-1 {
  animation-name: changeWidth;
  animation-delay: 0.8s;
}
.empty-dashboard .empty-boxes .animate-2 {
  animation-name: changeWidth;
  animation-delay: 1.5s;
}
@keyframes changeWidth {
  0% {
    width: 40%;
  }
  15% {
    width: 10%;
  }
  50% {
    width: 10%;
  }
  65% {
    width: 40%;
  }
  100% {
    width: 40%;
  }
}
.empty-dashboard .heading {
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 0;
  text-align: center;
}
.empty-dashboard .description {
  margin-top: 6px;
  font-size: 14px;
  opacity: 0.7;
  text-align: center;
}

.triggering {
  animation-name: triggering;
  animation-duration: 1.4s;
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
}

@keyframes triggering {
  0% {
    box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15), 0px 0px 0px -2px rgba(248, 150, 49, 0.6);
  }
  50% {
    @media (min-width: 736px) {
      border: 1px solid rgba(248, 150, 49, 0.6);
    }
  }
  100% {
    opacity: 1;
    box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15), 0px 0px 0px 10px rgba(248, 150, 49, 0);
    @media (min-width: 736px) {
      border: 1px solid rgb(218, 220, 232);
    }
  }
}
.text-animation {
  animation-name: text-animation;
  animation-duration: 1.2s;
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
}

@keyframes text-animation {
  35% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}
gridster {
  background: transparent !important;
  transition: 0.2s ease all;
}
gridster.less-focus {
  opacity: 0.6;
  filter: blur(1px);
}
gridster.less-focus gridster-item {
  pointer-events: none;
}

gridster-preview {
  border-radius: 6px;
  background: rgba(75, 158, 252, 0.15) !important;
  border: 1px dashed rgba(75, 158, 252, 0.65);
  opacity: 1;
  transition: 0.15s all ease-in-out;
  display: none;
}

gridster-grid {
  opacity: 1;
}

gridster-item {
  padding: 0 !important;
  overflow: visible !important;
}
@media (max-width: 735px) {
  gridster-item {
    z-index: inherit;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: auto !important;
  }
}
gridster-item.gridster-item-moving, gridster-item.gridster-item-resizing {
  transition: 0.15s transform ease-in-out, 0.15s box-shadow ease-in-out !important;
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 1px 6px 10px -3px rgba(20, 60, 100, 0.2), 6px 32px 44px -16px rgba(70, 100, 130, 0.3) !important;
  transform: scale(1.03, 1.03);
  border: 1px solid rgba(75, 158, 252, 0.65);
}
@media (min-width: 736px) {
  gridster-item:not(.gridster-item-moving):not(.editing):not(.gridster-item-resizing):hover {
    border: 1px solid rgba(75, 158, 252, 0.65);
    box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 1px 2px 6px -2px rgba(20, 60, 100, 0.16), 6px 12px 28px -10px rgba(70, 100, 130, 0.22) !important;
    z-index: 2;
  }
}
gridster-item .card-container {
  padding-bottom: 26px;
}
gridster-item.faded {
  transition: 0.4s all ease-in-out;
  opacity: 0.6;
  pointer-events: none;
}
gridster-item.faded .card-container .card-header {
  transition: 0.4s opacity ease-in-out;
  opacity: 0.4;
}
gridster-item.faded .card-container .card-content {
  transition: 0.4s opacity ease-in-out;
  opacity: 0;
}
gridster-item.editing {
  border: 1px solid rgba(75, 158, 252, 0.65);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 1px 3px 8px -3px rgba(20, 60, 100, 0.18), 6px 20px 32px -12px rgba(70, 100, 130, 0.24) !important;
  z-index: 2;
  transform: scale(1.02, 1.02);
}
gridster-item.gridster-item-resizing .card-container .card-content {
  background-color: #fff;
  pointer-events: none;
  opacity: 0.2;
}
gridster-item.prevent-pointer-events {
  pointer-events: none;
}
gridster-item .gridster-item-resizable-handler.handle-se {
  border-width: 0 0 12px 12px;
}

.animationIf.ng-enter,
.animationIf.ng-leave.ng-leave-active {
  opacity: 0;
}

.animationIf.ng-leave,
.animationIf.ng-enter.ng-enter-active {
  opacity: 1;
}

.card-container {
  display: flex;
  align-content: flex-start;
  width: 100%;
  height: 100%;
  flex-direction: column;
}
.card-container .popover-options {
  position: absolute;
  right: 8px;
  top: 8px;
  min-width: 180px;
  background-color: white;
  z-index: 5;
  padding: 0;
  display: block;
  transition: opacity ease-in-out 0.2s;
}
@media (max-width: 735px) {
  .card-container .popover-options {
    border-radius: 8px;
    border: 1px solid rgb(218, 220, 232);
  }
}
.card-container .popover-options .option {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  margin: 7px;
  padding: 10px;
  padding-top: 8px;
  padding-bottom: 8px;
  border-radius: 4px;
  transition: all ease-in-out 0.15s;
  cursor: pointer;
  outline: none;
  opacity: 0.8;
  font-weight: 600;
}
.card-container .popover-options .option:not(.delete):hover {
  background-color: rgba(218, 220, 232, 0.4);
  opacity: 1;
}
.card-container .popover-options .option:not(.delete):hover .icon {
  color: rgba(21, 57, 76, 0.9);
}
.card-container .popover-options .option.delete:hover {
  background-color: rgb(255, 236, 239);
  color: rgb(253, 61, 91);
  opacity: 1;
}
.card-container .popover-options .option.delete:hover .icon {
  color: rgb(253, 61, 91);
}
.card-container .popover-options .option .icon {
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
  margin-right: 8px;
  margin-left: 0;
  color: rgba(21, 57, 76, 0.7);
}
.card-container .popover-options .option .text {
  margin: 0;
}
.card-container .popover-options .option.disabled {
  pointer-events: none;
  opacity: 0.7;
}
.card-container .popover-options .separator {
  width: 100%;
  height: 1px;
  background-color: rgba(218, 220, 232, 0.5);
}
.card-container .card-header {
  cursor: move;
  display: flex;
  align-items: center;
  padding-left: 6px;
  padding-right: 8px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  width: calc(100% - 14px);
  height: 50px;
  min-height: 50px;
  border-bottom: 1px solid rgba(218, 220, 232, 0.5);
}
.card-container .card-header.gridster-item-content {
  cursor: auto;
}
.card-container .card-header:not(.gridster-item-content):hover {
  background-color: rgb(251, 251, 252);
}
.card-container .card-header.offline {
  opacity: 0.7;
}
.card-container .card-header .icon {
  width: 42px;
  margin: 0;
  margin-top: 2px;
  margin-right: 4px;
  opacity: 0.9;
}
.card-container .card-header .name {
  font-size: 13px;
  font-weight: 600;
  margin: 0;
  user-select: none;
  opacity: 0.9;
  display: inline-block;
  position: relative;
  max-width: 90%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: -6px;
}
.card-container .card-header .subheading {
  font-size: 13px;
  opacity: 0.65;
  margin: 0;
  user-select: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.card-container .card-header .subheading.bolder {
  text-transform: none;
  opacity: 0.8;
  font-weight: 600;
}
.card-container .card-header .edit-button {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  border-radius: 4px;
  height: 15px;
  width: 31px;
  padding-top: 8px;
  padding-bottom: 8px;
  outline: none;
  border: 1px solid transparent;
  transition: 0.15s all ease-in-out;
  cursor: pointer;
}
.card-container .card-header .edit-button:hover {
  background: white;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
}
.card-container .card-header .edit-button .dot {
  border-radius: 50%;
  width: 3px;
  height: 3px;
  background-color: #15394C;
  opacity: 0.75;
}
.card-container .card-header .edit-name-input {
  outline: none;
  color: #15394C;
  font-size: 13px;
  font-weight: bold;
  border-radius: 4px;
  background-color: transparent;
  border: 0px solid rgb(218, 220, 232);
}
.card-container .loading-card {
  height: calc(100% - 50px);
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.card-container .card-content {
  flex-grow: 1;
  width: 100%;
  height: calc(100% - 51px);
  border-radius: 6px;
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 0;
  user-select: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  opacity: 0;
}
.card-container .card-content.done-loading {
  opacity: 1;
}
.card-container .card-content.columns {
  padding-bottom: 0;
  flex-direction: row;
}
.card-container .card-content-main {
  display: flex;
  flex-direction: row;
  background-color: rgb(252, 252, 255);
  align-items: center;
  justify-content: center;
  flex-grow: 1;
}
.card-container .card-content-main .placholder-text {
  text-align: center;
  opacity: 0.7;
  font-size: 13px;
  margin-top: 8px;
  margin-bottom: 8px;
}
.card-container .card-content-main.single-column {
  flex-direction: column;
}
.card-container .card-content-main.single-column .right-content {
  max-height: 100px;
  border-top: 1px solid rgba(218, 220, 232, 0.5);
}
.card-container .card-content-main .graph-container {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
}
.card-container .card-content-main .graph-container.no-graph {
  flex-grow: 0;
}
.card-container .card-content-main .right-content {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.7);
  border-left: 1px solid rgba(218, 220, 232, 0.5);
}
.card-container .card-content-main .right-content.full-width {
  flex-grow: 1;
  width: 100%;
  border-left-width: 0;
}
.card-container .card-content-main .right-content.vertical {
  flex-direction: column-reverse;
}
.card-container .card-content-main .right-content.vertical .current-value {
  border-left-width: 0;
  border-bottom: 1px solid rgba(218, 220, 232, 0.5);
}
.card-container .card-content-main .right-content .current-value {
  height: 100%;
  min-width: 120px;
  padding: 5px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
@media (max-width: 735px) {
  .card-container .card-content-main .right-content .current-value {
    min-width: 80px;
  }
}
.card-container .card-content-main .right-content .current-value.full-width {
  flex-grow: 1;
  width: 100%;
}
.card-container .card-content-main .right-content .current-value .value-header {
  opacity: 0.5;
  margin: 0;
  margin-top: 4px;
  font-size: 13px;
  font-weight: 500;
  text-align: center;
}
.card-container .card-content-main .right-content .current-value .value {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  text-align: center;
  line-height: 24px;
}
@media (max-width: 735px) {
  .card-container .card-content-main .right-content .current-value .value {
    font-size: 14px;
    line-height: 20px;
  }
}
.card-container .card-content-main .highcharts-background {
  fill: rgb(252, 252, 255);
}
.card-container .card-content-main .highcharts-plot-background {
  fill: rgb(252, 252, 255);
}
.card-container .card-content-main .highcharts-xrange-series .highcharts-point {
  stroke-width: 0px;
}
.card-container .card-content-main .highcharts-heatmap-series .highcharts-point {
  stroke-width: 1px; /* default for standard displays */
}
@media (min-resolution: 2dppx) {
  .card-container .card-content-main .highcharts-heatmap-series .highcharts-point {
    stroke-width: 0.5px; /* for high-resolution displays */
  }
}
.card-container .card-content-main .highcharts-heatmap-series .highcharts-point {
  stroke: rgba(255, 255, 255, 0.2);
}
.card-container .card-content-main .highcharts-heatmap-series .highcharts-point.highcharts-point-hover {
  stroke: white;
}
.card-container .card-content-main .highcharts-yaxis-grid:not(.highcharts-heatmap-yaxis) .highcharts-grid-line {
  stroke-width: 1;
}
.card-container .card-content-main .highcharts-yaxis-grid:not(.highcharts-heatmap-yaxis).humidity-temp-yaxis {
  display: none;
}
.card-container .card-content-main .graph-section {
  flex-grow: 1;
}
.card-container .card-content .stats {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 15px;
  background-color: rgba(255, 255, 255, 0.7);
  border-top: 0;
}
.card-container .card-content .stats .stats-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding-top: 2px;
  padding-bottom: 2px;
}
.card-container .card-content .stats .stats-item .stats-header {
  opacity: 0.6;
  text-transform: uppercase;
  margin: 0;
  font-size: 13px;
  margin-right: 6px;
}
.card-container .card-content .stats .stats-item .stats-value {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  opacity: 0.8;
  text-align: right;
}
.card-container .card-content .missing-devices .description {
  text-align: center;
  opacity: 0.9;
  margin-top: 0;
  margin-bottom: 10px;
  margin-right: 8px;
  margin-left: 8px;
}
.card-container .card-content .missing-devices .icon-button {
  height: 30px;
  min-height: 30px;
  line-height: 30px;
  margin: 0;
}
.card-container .card-content .live-state-card {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.card-container .card-content .live-state-card .live-values {
  display: flex;
  flex-direction: row;
  flex-grow: 1;
  text-align: center;
  align-items: center;
  justify-content: space-evenly;
}
.card-container .card-content .live-state-card .live-values-column {
  width: 50%;
}
.card-container .card-content .live-state-card .live-values .separator {
  height: 100%;
  width: 1px;
  background-color: rgba(218, 220, 232, 0.8);
}
.card-container .card-content .live-state-card .live-values .number {
  font-size: 24px;
  font-weight: 600;
  margin: 0;
}
.card-container .card-content .live-state-card .live-values .number.larger-font {
  font-size: 32px;
  line-height: 42px;
}
.card-container .card-content .live-state-card .live-values .description {
  margin: 0;
  opacity: 0.8;
  font-weight: 600;
}
.card-container .card-content .live-state-card .live-values .description.larger-font {
  font-size: 15px;
}
.card-container .card-content .live-state-card .footer {
  border-top: 1px solid rgba(218, 220, 232, 0.8);
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.card-container .card-content .live-state-card .footer .text {
  font-size: 12px;
  margin: 0;
  text-align: center;
  opacity: 0.6;
}
.card-container .card-content .live-state-card .floating-device-overview {
  position: absolute;
  top: calc(100% - 20px);
  width: calc(100% - 12px);
  opacity: 0;
  transform: translateY(-4px);
  transition: all 0.25s;
  z-index: 10;
  pointer-events: none;
}
.card-container .card-content .live-state-card .floating-device-overview.visible {
  pointer-events: all;
  opacity: 1;
  transform: translateY(0);
}
.card-container .card-content .live-state-card .floating-device-overview .capture-mouse-header {
  height: 16px;
  width: 100%;
  padding: 6px;
  background-color: transparent;
}
.card-container .card-content .live-state-card .floating-device-overview .device-container {
  width: 100%;
  padding: 6px;
  background-color: rgb(252, 252, 255);
  max-height: 290px;
  overflow-y: scroll !important;
  border-radius: 8px;
  border: 1px solid #dadce8;
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}
.card-container .card-content .live-state-card .floating-device-overview .device-container .device-status {
  margin: 0;
  font-size: 12px;
  padding: 5px 6px;
  transition: all 0.25s;
}
.card-container .card-content .live-state-card .floating-device-overview .device-container .device-status.offline span {
  opacity: 0.65;
  font-weight: 400;
}
.card-container .card-content .live-state-card .floating-device-overview .device-container .device-status:not(:last-child) {
  box-shadow: 0 1px 0 0 rgba(218, 220, 232, 0.6);
}
.card-container .card-content .live-state-card .floating-device-overview .device-container .device-status:hover {
  background-color: white;
  border-radius: 4px;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.14), 0px 3px 6px 0px rgba(60, 66, 88, 0.1);
  cursor: pointer;
}
.card-container .card-content .live-state-card .floating-device-overview .device-container .device-status .status {
  display: inline-block;
  width: 90px;
  font-weight: 600;
}
.card-container .card-content .live-state-card .floating-device-overview .device-container .device-status .name {
  display: inline-block;
}

.heatmap-tooltip {
  color: white;
}
.heatmap-tooltip .header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.heatmap-tooltip .value-indicator {
  position: absolute;
  width: 2px;
  border-radius: 1px;
  top: -4px;
  height: 18px;
  background-color: white;
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);
}
.heatmap-tooltip .colors {
  position: relative;
  width: 200px;
  height: 10px;
  margin-top: 8px;
  border-radius: 5px;
  background: rgb(84, 174, 88);
  background: linear-gradient(90deg, rgb(84, 174, 88) 0%, rgb(162, 199, 84) 40%, rgb(240, 198, 70) 50%, rgb(229, 150, 65) 70%, rgb(222, 56, 50) 85%);
}
.heatmap-tooltip .numbers {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.heatmap-tooltip .numbers .number {
  width: 26px;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  margin-top: 4px;
  margin-bottom: 0;
}
.heatmap-tooltip .description {
  max-width: 200px;
  margin-top: 8px;
  margin-bottom: 2px;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
  white-space: normal;
}
.heatmap-tooltip .description .description-header {
  margin: 0;
  margin-bottom: 2px;
  font-size: 12px;
}
.heatmap-tooltip .description .description-text {
  margin: 0;
  opacity: 0.8;
  font-size: 11px;
}

.dashboard-modal {
  background-color: rgb(248, 248, 250);
  transition: all 0.2s ease-in-out;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-self: stretch;
}
@media (max-width: 1365px) {
  .dashboard-modal {
    height: 100%;
  }
}
@media (min-width: 960px) {
  .dashboard-modal {
    width: 640px;
  }
}
.dashboard-modal .close-button {
  position: absolute;
  height: 42px;
  right: 0;
  margin-right: 0;
  padding-right: 0;
}
.dashboard-modal .modal-heading {
  font-size: 20px;
  text-align: center;
  font-weight: 600;
  margin-top: 42px;
  margin-bottom: 4px;
}
.dashboard-modal .modal-subheading {
  text-align: center;
  margin: 0;
  font-size: 14px;
  opacity: 0.6;
  margin-bottom: 28px;
}
.dashboard-modal .content-container {
  transition: all 0.2s ease-in-out;
  overflow: hidden;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
@media (max-width: 735px) {
  .dashboard-modal .content-container {
    padding: 0px;
    height: 100vh;
  }
}
@media (min-width: 960px) {
  .dashboard-modal .content-container {
    height: 80vh;
  }
}
.dashboard-modal .content-container .main-content {
  flex-grow: 1;
  overflow: scroll;
  overflow-x: hidden;
  padding-left: 46px;
  padding-right: 46px;
}
@media (max-width: 735px) {
  .dashboard-modal .content-container .main-content {
    padding: 0;
  }
}
.dashboard-modal .content-container .main-content .idea-text {
  text-align: center;
  opacity: 0.6;
  color: #15394C;
  font-size: 13px;
  line-height: 24px;
  margin-top: 28px;
}
.dashboard-modal .content-container .main-content .type-option {
  margin: 20px;
  margin-top: 0;
  padding: 12px;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.7);
  border: 1px solid rgb(208, 208, 214);
  display: flex;
  flex-direction: row;
  align-items: center;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
  outline: none;
}
.dashboard-modal .content-container .main-content .type-option:hover {
  border: 1px solid rgba(75, 158, 252, 0.65);
  background-color: rgba(234, 242, 255, 0.5);
}
.dashboard-modal .content-container .main-content .type-option.selected, .dashboard-modal .content-container .main-content .type-option:active {
  border: 1px solid rgba(75, 158, 252, 0.8);
  background-color: rgb(234, 242, 255);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15);
}
.dashboard-modal .content-container .main-content .type-option .single-sensor {
  height: 42px;
  width: 42px;
  margin: 12px;
  margin-right: 22px;
  background-color: #fff;
  border-radius: 3px;
  box-shadow: 0 0px 1px rgb(20, 40, 60), 0 2px 5px -2px rgba(20, 60, 100, 0.3), 0 4px 10px -2px rgba(70, 100, 130, 0.1);
}
.dashboard-modal .content-container .main-content .type-option .single-sensor:before {
  display: block;
  position: relative;
  content: "";
  width: 4px;
  height: 4px;
  top: 4px;
  left: 4px;
  background-color: #FF5331;
  border-radius: 50%;
}
.dashboard-modal .content-container .main-content .type-option .single-sensor.duplicated {
  transform: scale(0.9);
  margin-top: 14px;
  margin-bottom: 20px;
  margin-left: 14px;
  margin-right: 25px;
}
.dashboard-modal .content-container .main-content .type-option .single-sensor.placed-on-top {
  margin-top: 6px;
  margin-left: 10px;
}
.dashboard-modal .content-container .main-content .type-option .text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  width: 80%;
}
.dashboard-modal .content-container .main-content .type-option .text .heading {
  font-weight: 600;
  font-size: 14px;
  margin: 0;
  margin-bottom: 2px;
  opacity: 0.9;
}
.dashboard-modal .content-container .main-content .type-option .text .description {
  font-weight: 400;
  font-size: 13px;
  opacity: 0.7;
  margin: 0;
}
@media (max-width: 735px) {
  .dashboard-modal .content-container .main-content .select-sensor-container {
    padding-left: 12px;
    padding-right: 12px;
  }
}
.dashboard-modal .content-container .main-content .select-sensor-container .search-box {
  display: flex;
  position: sticky;
  top: 1px;
  z-index: 2;
}
.dashboard-modal .content-container .main-content .select-sensor-container .search-box .icon-button:disabled {
  opacity: 0.9;
  background-color: rgb(248, 248, 250);
}
.dashboard-modal .content-container .main-content .select-sensor-container .search-box .icon-button:disabled .icon-button__text {
  opacity: 0.65;
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-table {
  background-color: transparent;
}
.dashboard-modal .content-container .main-content .select-sensor-container .table-header {
  background-color: transparent;
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 10px;
  padding-right: 12px;
  margin-bottom: 4px;
  outline: none;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 6px;
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row:hover {
  transition: all 0.2s ease-in-out;
  border: 1px solid rgba(75, 158, 252, 0.65);
  background-color: rgba(234, 242, 255, 0.5);
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row .icons {
  transition: all 0.2s ease-in-out;
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row.non-selectable {
  opacity: 0.4;
  border: 1px solid transparent;
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row .name {
  margin: 0;
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row .name .description {
  font-weight: normal !important;
  font-size: 0.9em;
  opacity: 0.6;
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row.selected, .dashboard-modal .content-container .main-content .select-sensor-container .sensor-row:active {
  border: 1px solid rgba(75, 158, 252, 0.8);
  background-color: rgb(234, 242, 255);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15);
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row.selected .name, .dashboard-modal .content-container .main-content .select-sensor-container .sensor-row:active .name {
  font-weight: 600;
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row.selected .icons, .dashboard-modal .content-container .main-content .select-sensor-container .sensor-row:active .icons {
  border-color: transparent;
  background-color: white;
  border-radius: 4px;
  box-shadow: 0 0px 1px rgb(20, 40, 60), 0 2px 5px -2px rgba(20, 60, 100, 0.3), 0 4px 10px -2px rgba(70, 100, 130, 0.1);
}
.dashboard-modal .content-container .main-content .select-sensor-container .sensor-row .section {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.dashboard-modal .content-container .main-content .options-container {
  margin: 24px;
  margin-top: 0;
}
.dashboard-modal .content-container .main-content .options-container .header {
  margin-top: 0;
  margin-left: 6px;
  margin-bottom: 10px;
  opacity: 0.6;
  color: #15394C;
  font-size: 14px;
}
.dashboard-modal .content-container .main-content .options-container .name-box {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 0;
}
.dashboard-modal .content-container .main-content .options-container .name-box .name {
  padding: 10px 12px;
  width: 100%;
  outline: none;
  color: #15394C;
  font-size: 14px;
  font-weight: bold;
  border-radius: 6px;
  box-shadow: 0 1px 4px -2px rgba(20, 40, 60, 0.2);
}
@media (max-width: 735px) {
  .dashboard-modal .content-container .main-content .options-container .name-box .name {
    border: 1px solid rgb(218, 220, 232);
  }
}
.dashboard-modal .content-container .main-content .options-container .layout-container {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
@media (max-width: 735px) {
  .dashboard-modal .content-container .main-content .options-container .layout-container {
    display: none;
  }
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 26%;
  outline: none;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option {
  width: 100%;
  padding: 10px;
  border: 1px solid rgba(208, 208, 214, 0.5);
  box-shadow: inset 0px 0px 12px 0px rgba(20, 40, 60, 0.05);
  border-radius: 6px;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option.grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 20px 20px 20px 4px;
  grid-column-gap: 2px;
  grid-row-gap: 2px;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option .card {
  background-color: #fff;
  border-radius: 3px;
  margin: 2px;
  box-shadow: 0 0px 1px rgb(20, 40, 60), 0 2px 5px -2px rgba(20, 60, 100, 0.3), 0 4px 10px -2px rgba(70, 100, 130, 0.1);
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option .card.selected {
  background-color: #15394C;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option .card.layout-2-1 {
  grid-column-start: 1;
  grid-column-end: 3;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option .card.layout-3-1 {
  grid-column-start: 1;
  grid-column-end: 4;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option .card.layout-1-2 {
  grid-row-start: 1;
  grid-row-end: 3;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option .card.layout-4-1 {
  grid-column-start: 1;
  grid-column-end: 5;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option .card.layout-2-2 {
  grid-row-start: 1;
  grid-row-end: 3;
  grid-column-start: 1;
  grid-column-end: 3;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option .break {
  flex-basis: 100%;
  height: 0;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option:hover {
  border: 1px solid rgba(75, 158, 252, 0.65);
  background-color: rgba(234, 242, 255, 0.5);
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option.selected, .dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option:active {
  border: 1px solid rgba(75, 158, 252, 0.8);
  background-color: rgb(234, 242, 255);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15);
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option-text {
  margin-top: 4px;
  margin-bottom: 12px;
  opacity: 0.8;
  color: #15394C;
  font-size: 13px;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option-text.selected {
  font-weight: 600;
  opacity: 1;
}
.dashboard-modal .content-container .main-content .options-container .layout-container .option-container .option-text.centered {
  text-align: center;
  margin: 10px 0;
}
.dashboard-modal .content-container .footer {
  min-height: 100px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  position: relative;
  border-top: 1px solid rgb(218, 220, 232);
  padding-left: 52px;
  padding-right: 52px;
}
@media (max-width: 735px) {
  .dashboard-modal .content-container .footer {
    padding: 0px;
    min-height: 70px;
  }
}
.dashboard-modal .content-container .footer .footer-button {
  transition: 0.2s all ease-in-out;
  opacity: 0;
  pointer-events: none;
  border-radius: 6px;
  padding-left: 12px;
  padding-right: 12px;
  height: 38px;
  text-transform: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.dashboard-modal .content-container .footer .footer-button.icon-button {
  width: 150px;
  margin: 6px 8px 6px 8px;
}
.dashboard-modal .content-container .footer .footer-button.visible {
  opacity: 1;
  pointer-events: all;
}
.dashboard-modal .content-container .footer .footer-button .save-circle {
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #17384c;
}
.dashboard-modal .content-container .footer .footer-button .arrow {
  width: 2px;
  height: 2px;
  border-style: solid;
  border-color: #15394C;
  border-width: 0 2px 2px 0;
  padding: 2px;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  margin-right: 6px;
}
.dashboard-modal .content-container .footer .footer-button .arrow.right {
  margin-left: 6px;
  margin-right: 0;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
.dashboard-modal .content-container .footer .footer-button .text {
  font-weight: 600;
  margin: 0;
}
.dashboard-modal .content-container .footer .icon-button {
  margin: 0;
}
.dashboard-modal .content-container .footer .steps {
  display: flex;
  flex-direction: row;
  opacity: 0;
  transition: 0.2s all ease-in-out;
}
.dashboard-modal .content-container .footer .steps.visible {
  opacity: 1;
}
.dashboard-modal .content-container .footer .steps .step {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: lightgray;
  margin-left: 4px;
  margin-right: 4px;
  transition: 0.2s all ease-in-out;
}
.dashboard-modal .content-container .footer .steps .step.current-step {
  background-color: lightslategray;
  transform: scale(1.2, 1.2);
}

.settings-modal {
  background-color: rgb(248, 248, 250);
  transition: all 0.2s ease-in-out;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-self: stretch;
}
@media (max-width: 1365px) {
  .settings-modal {
    height: 100%;
  }
}
@media (min-width: 960px) {
  .settings-modal {
    width: 600px;
  }
}
.settings-modal .modal-heading {
  font-size: 18px;
  text-align: center;
  font-weight: 600;
  margin-top: 30px;
  margin-bottom: 4px;
}
.settings-modal .modal-subheading {
  text-align: center;
  margin: 0;
  font-size: 14px;
  opacity: 0.6;
  min-height: 36px;
}
.settings-modal .content-container {
  transition: all 0.2s ease-in-out;
  padding: 52px;
  padding-top: 10px;
  padding-bottom: 20px;
  overflow: hidden;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
@media (max-width: 735px) {
  .settings-modal .content-container {
    padding: 16px;
  }
}
.settings-modal .content-container .main-content {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.settings-modal .content-container .main-content .clear-button {
  text-transform: none;
  border-radius: 6px;
  background-color: rgb(230, 60, 60);
}
.settings-modal .content-container .main-content .clear-button .text {
  color: white;
  font-weight: 600;
  margin-left: 8px;
  margin-right: 8px;
}
.settings-modal .content-container .main-content .clear-description {
  margin-top: 4px;
  opacity: 0.5;
  font-size: 13px;
  text-align: center;
}

.billing-information .information-container .items-container {
  justify-content: space-between;
}
@media (max-width: 735px) {
  .billing-information .information-container .items-container {
    flex-direction: column;
    align-items: flex-start;
  }
}
.billing-information .information-container .items-container .info-item {
  min-width: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (max-width: 735px) {
  .billing-information .information-container .items-container .info-item {
    max-width: 100%;
  }
}
.billing-information .information-container .items-container .info-item .header {
  opacity: 0.7;
  margin-top: 0;
  margin-bottom: 2px;
}
.billing-information .information-container .items-container .info-item .value {
  display: flex;
  align-items: center;
  font-size: 14px;
}
.billing-information .information-container .items-container .info-item .value.no-value {
  padding: 2px 12px 2px 6px;
  border: 1px dashed rgba(255, 150, 21, 0.7);
  background-color: rgba(255, 150, 21, 0.03);
  border-radius: 4px;
  align-self: flex-start;
}
@media (max-width: 735px) {
  .billing-information .information-container .items-container .info-item .value {
    margin-bottom: 16px;
  }
}
.billing-information .information-container .items-container .info-item .value md-icon {
  margin-left: 0;
  margin-right: 2px;
}
.billing-information .information-container .items-container .info-item .value md-icon path {
  fill: #FF9615;
}
.billing-information .information-container .items-container .info-item .value .no-value {
  opacity: 0.9;
  font-size: 12px;
}

.billing-license-info {
  padding: 0 !important;
}
.billing-license-info .top-section {
  display: flex;
  flex-direction: row;
}
@media (max-width: 735px) {
  .billing-license-info .top-section {
    flex-direction: column;
  }
}
.billing-license-info .top-section .divider {
  display: flex;
  width: 1px;
  background-color: rgba(218, 220, 232, 0.8);
  margin: 0px;
}
.billing-license-info .top-section .license-section {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 20px;
}
@media (max-width: 735px) {
  .billing-license-info .top-section .license-section {
    border-bottom: 1px solid rgba(218, 220, 232, 0.8);
  }
}
.billing-license-info .top-section .license-section .top-text {
  color: #697878;
  margin-bottom: 3px;
}
.billing-license-info .top-section .license-section .value-text {
  font-size: 14px;
  font-weight: 600;
}
.billing-license-info .top-section .license-section .value-text .value-comment {
  font-size: 13px;
  opacity: 0.7;
  font-weight: 400;
  margin-left: 2px;
}
.billing-license-info .top-section .license-section .bottom-text {
  margin-top: 4px;
  font-size: 12px;
  opacity: 0.7;
}
.billing-license-info .top-section .license-section .clickable-text {
  margin-top: 4px;
  font-size: 12px;
  color: #0E6FA3;
  text-decoration: underline;
  cursor: pointer;
  opacity: 0.85;
  user-select: none;
}
.billing-license-info .top-section .license-section .clickable-text:hover {
  opacity: 1;
}
.billing-license-info .projects-section {
  display: flex;
  flex-direction: column;
  padding: 20px;
  border-top: 1px solid rgba(218, 220, 232, 0.8);
}
.billing-license-info .projects-section .header {
  margin-bottom: 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
}

.subscriptions-invoices-orders-container .tab-options {
  display: flex;
  flex-direction: row;
  gap: 16px;
  margin-bottom: 8px;
}
.subscriptions-invoices-orders-container .tab-options .tab-option {
  padding: 10px 20px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 8px;
  cursor: pointer;
}
.subscriptions-invoices-orders-container .tab-options .tab-option .number {
  opacity: 0.7;
  font-size: 0.95em;
}
.subscriptions-invoices-orders-container .tab-options .tab-option:hover {
  border-color: #dadce8;
  background-color: rgb(248, 252, 255);
}
.subscriptions-invoices-orders-container .tab-options .tab-option.active {
  font-weight: 600;
  border: 1px solid rgba(75, 158, 250, 0.8);
  background-color: rgb(248, 252, 255);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15);
}
.subscriptions-invoices-orders-container table.md-table {
  overflow: visible;
}
.subscriptions-invoices-orders-container table.md-table:not(.md-row-select) td.md-cell:nth-child(n+2):nth-last-child(n+2), .subscriptions-invoices-orders-container table.md-table:not(.md-row-select) th.md-column:nth-child(n+2):nth-last-child(n+2) {
  padding: 0 16px 0 0;
}
.subscriptions-invoices-orders-container table.md-table tr.md-row:not(:hover) .info-hint md-icon {
  opacity: 0;
}
.subscriptions-invoices-orders-container table.md-table tr.md-row.not-clickable {
  cursor: default !important;
}
.subscriptions-invoices-orders-container table.md-table .md-cell .chevron {
  opacity: 0.5;
  transition: all 0.3s ease;
}
.subscriptions-invoices-orders-container table.md-table .md-cell .chevron.rotated {
  transform: rotate(90deg);
}
.subscriptions-invoices-orders-container table.md-table .md-cell .chevron.hidden {
  opacity: 0;
}
.subscriptions-invoices-orders-container table.md-table .kit-section {
  padding: 0px 0 0px 22px;
  margin-left: 14px;
  margin-top: 8px;
  margin-bottom: 16px;
  border-left: 2px solid rgba(218, 220, 232, 0.5);
}
.subscriptions-invoices-orders-container table.md-table .kit-section .kit-table .table-header {
  background-color: #f6f8fa;
}
.subscriptions-invoices-orders-container table.md-table .md-cell md-icon {
  transition: all 0.3s ease;
}
.subscriptions-invoices-orders-container table.md-table .md-cell md-icon.rotated {
  transform: rotate(90deg);
}
.subscriptions-invoices-orders-container table.md-table .md-checkbox-cell, .subscriptions-invoices-orders-container table.md-table .md-checkbox-column {
  padding: 1px 0 0 12px !important;
}

.billing-information-modal {
  width: 100%;
}
.billing-information-modal.content-box {
  padding: 0;
  border-radius: 0;
  border: none;
}
.billing-information-modal.content-box .information-container {
  border-radius: 0;
  padding: 50px;
}
@media (max-width: 735px) {
  .billing-information-modal.content-box .information-container {
    padding: 20px 20px 15px 20px;
  }
}
.billing-information-modal.content-box .information-container {
  border-bottom: 1px solid rgb(218, 220, 232);
}
.billing-information-modal.content-box .information-container .flex-info-columns {
  display: flex;
  flex-direction: column;
}
@media (min-width: 736px) {
  .billing-information-modal.content-box .information-container .flex-info-columns {
    flex-direction: row;
    gap: 42px;
  }
}
.billing-information-modal .content-box__footer {
  padding: 25px 50px 25px 50px;
}
@media (max-width: 735px) {
  .billing-information-modal .content-box__footer {
    padding: 20px;
  }
}

.subscription-modal {
  min-height: 85vh;
}
.subscription-modal md-toolbar {
  min-height: auto;
}
.subscription-modal md-toolbar .md-toolbar-tools {
  width: 100%;
  height: auto;
  max-height: fit-content;
  flex-direction: column;
  align-items: flex-start;
  background-color: #F1F3F7;
  border-bottom: 1px solid #dadce8;
  padding: 20px 24px;
}
.subscription-modal md-toolbar .md-toolbar-tools .heading {
  font-size: 18px;
  font-weight: 600;
  color: rgb(44, 63, 74);
}
.subscription-modal md-toolbar .md-toolbar-tools .header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  width: 100%;
  padding: 6px 0 16px 0;
}
.subscription-modal md-toolbar .md-toolbar-tools .header .device-description {
  margin-top: 0;
  font-size: 14px;
  color: #15394C;
  margin-top: 0;
}
.subscription-modal md-toolbar .md-toolbar-tools .info-section {
  border: 1px solid rgb(218, 220, 232);
  border-radius: 6px;
  padding: 12px 20px;
  width: 100%;
  display: flex;
  flex-direction: column;
  color: #15394C;
}
.subscription-modal md-toolbar .md-toolbar-tools .info-section .info-items {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.subscription-modal md-toolbar .md-toolbar-tools .info-section .info-items .info-item {
  min-width: 18%;
}
.subscription-modal md-toolbar .md-toolbar-tools .info-section .info-items .info-item .info-title {
  font-size: 13px;
  opacity: 0.7;
  margin-top: 0;
  margin-bottom: 2px;
}
.subscription-modal md-toolbar .md-toolbar-tools .info-section .info-items .info-item .info-value {
  font-size: 14px;
  margin: 0;
}
.subscription-modal md-toolbar .md-toolbar-tools .search-section {
  display: flex;
  align-items: center;
  width: 100%;
}
.subscription-modal md-toolbar .md-toolbar-tools .search-section dt-search-box {
  width: 100%;
}
.subscription-modal md-toolbar .md-toolbar-tools .search-section .icon-button {
  height: 38px;
  font-size: 14px;
}
.subscription-modal md-toolbar .md-toolbar-tools .search-section .icon-button .active-filters {
  border-left: 1px solid rgb(218, 220, 232);
  padding-left: 8px;
  margin-left: 4px;
  font-size: 14px;
}
.subscription-modal md-dialog-content {
  position: relative;
  min-height: 50vh;
}
.subscription-modal md-dialog-content .md-row .icon-button.view-device {
  position: absolute;
  margin-left: -44px;
  margin-top: -2px;
}
.subscription-modal md-dialog-content .md-row:not(:hover) .icon-button.view-device {
  opacity: 0;
}
.subscription-modal md-dialog-content .hidden-devices-text {
  opacity: 0.6;
  text-align: center;
  margin-top: 36px;
  margin-bottom: 36px;
}
.subscription-modal md-dialog-content .empty-content {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.subscription-modal md-dialog-actions {
  border-top: 1px solid rgba(218, 220, 232, 0.8);
}
.subscription-modal md-dialog-actions .filter-description {
  font-size: 14px;
  opacity: 0.8;
}

.plan-options-modal {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: start;
  padding: 24px;
}
.plan-options-modal .header-container {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 2px;
}
.plan-options-modal .header-container .header {
  font-size: 16px;
  font-weight: 600;
}
.plan-options-modal .header-container .sub-header {
  opacity: 0.8;
}
.plan-options-modal .plans-container {
  display: flex;
  flex-direction: row;
  gap: 12px;
  justify-content: center;
}
@media (max-width: 735px) {
  .plan-options-modal .plans-container {
    flex-direction: column;
  }
}
.plan-options-modal .plans-container .plan {
  width: 220px;
  padding: 20px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: center;
}
.plan-options-modal .plans-container .plan.current {
  border: 1px solid rgba(75, 158, 250, 0.8);
  background-color: rgb(248, 252, 255);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -3px rgba(20, 60, 100, 0.1), 0px 12px 20px -10px rgba(70, 100, 130, 0.15);
}
.plan-options-modal .plans-container .plan .name {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 4px;
}
.plan-options-modal .plans-container .plan .description {
  opacity: 0.8;
  margin-bottom: 8px;
  width: 100%;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(218, 220, 232, 0.6);
}
.plan-options-modal .plans-container .plan .coming-soon {
  margin-top: 4px;
}

.popover .content {
  max-height: 500px;
  overflow-y: scroll;
}
.popover .content .section {
  border-bottom: 1px solid rgba(218, 220, 232, 0.7);
  font-weight: 600;
}
.popover .content .section.disabled-section {
  pointer-events: none;
  opacity: 0.6;
}
.popover .content .section .section-name {
  margin: 0;
  padding-bottom: 10px;
  user-select: none;
}
.popover .content .section .options-section {
  border-top: 1px solid rgba(218, 220, 232, 0.7);
  background-color: rgb(246, 248, 250);
  padding: 4px 8px 10px 8px;
  transition: max-height 0.3s ease 0s, padding 0.3s ease 0s;
  max-height: 1000px;
  overflow: hidden;
}
.popover .content .section .options-section.hidden {
  max-height: 0;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.popover .content .section .options-section .option-name {
  margin: 0;
  font-weight: normal;
  font-size: 13px;
}
.popover .content .filter-checkbox {
  min-height: 36px;
}
.popover .content .filter-checkbox .md-label {
  margin-left: 30px;
}

.add-licenses-modal {
  background: white;
  border-radius: 12px;
  max-width: 860px;
  color: #15394C;
  max-height: 90%;
  min-width: 420px;
}
@media (max-width: 735px) {
  .add-licenses-modal {
    min-width: auto;
  }
}
.add-licenses-modal .mobile-close-button {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 32px;
  height: 32px;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 24px;
  font-weight: 300;
  color: #666;
  border-radius: 50%;
  z-index: 10;
  transition: all 0.2s ease;
}
@media (max-width: 959px) {
  .add-licenses-modal .mobile-close-button {
    display: flex;
  }
}
.add-licenses-modal .modal-header {
  padding: 24px;
  border-bottom: 1px solid rgba(218, 220, 232, 0.6);
}
.add-licenses-modal .modal-header h2 {
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 4px 0;
}
.add-licenses-modal .modal-header .modal-subtext {
  font-size: 14px;
  color: #666;
  margin: 0;
}
.add-licenses-modal .license-content {
  display: flex;
  flex-direction: column;
  padding: 36px;
  background-color: #F1F3F7;
  padding-bottom: 100px;
  min-height: 60vh;
}
@media (max-width: 735px) {
  .add-licenses-modal .license-content {
    padding: 10px 10px 60px 10px;
    height: auto;
  }
}
.add-licenses-modal .dt-badge {
  font-size: 0.9em;
  padding: 2px 7px;
}
.add-licenses-modal .dt-badge.adding {
  border: 1px solid rgb(130, 195, 60);
  background-color: rgb(230, 240, 230);
}
.add-licenses-modal .dt-badge.removing {
  border: 1px solid rgb(220, 140, 75);
  background-color: rgb(246, 240, 237);
}
.add-licenses-modal .divider-line {
  height: 38px;
  min-height: 38px;
  width: 1px;
  background-color: #dadce8;
  margin: 0 auto;
}
.add-licenses-modal .divider-line.small {
  height: 12px;
  min-height: 12px;
}
.add-licenses-modal .license-section {
  background-color: white;
  padding: 0px;
  border-radius: 8px;
  border: 1px solid rgb(218, 220, 232);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}
.add-licenses-modal .license-section.faded {
  opacity: 0.7;
}
.add-licenses-modal .license-section .license-table {
  display: flex;
  flex-direction: row;
}
@media (max-width: 735px) {
  .add-licenses-modal .license-section .license-table {
    flex-direction: column;
  }
}
.add-licenses-modal .license-section .license-table .license-column {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  flex: 1;
}
@media (max-width: 735px) {
  .add-licenses-modal .license-section .license-table .license-column.cellular {
    border-top: 1px solid rgba(218, 220, 232, 0.8);
  }
}
.add-licenses-modal .license-section .license-table .license-column:first-child {
  border-right: 1px solid rgba(218, 220, 232, 0.8);
}
.add-licenses-modal .license-section .license-table .license-column:last-child {
  margin-bottom: 0;
}
.add-licenses-modal .license-section .license-table .license-column .license-row {
  display: flex;
  width: 100%;
  height: 42px;
  align-items: center;
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
}
.add-licenses-modal .license-section .license-table .license-column .license-row .strike-through {
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(21, 57, 76, 0.5);
}
.add-licenses-modal .license-section .license-table .license-column .license-row .left-label {
  display: flex;
  flex-direction: column;
  width: 50%;
  height: 100%;
  justify-content: center;
  align-items: end;
  padding: 0 12px;
  opacity: 0.9;
  text-align: right;
  border-right: 1px solid rgba(218, 220, 232, 0.8);
}
.add-licenses-modal .license-section .license-table .license-column .license-row .left-label .error-message {
  font-size: 12px;
  margin-top: -4px;
  margin-bottom: 4px;
  color: rgb(210, 40, 21);
}
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value {
  display: flex;
  width: 50%;
  max-width: 150px;
  height: 100%;
  justify-content: start;
  align-items: center;
  font-size: 14px;
  font-weight: 600;
  padding: 0 12px;
}
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value.green-background {
  background-color: #D0E1CF;
}
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value input::-webkit-outer-spin-button,
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value input[type=number] {
  -moz-appearance: textfield;
}
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value .add-license-input {
  width: inherit;
  outline: none;
  border: none;
  margin: 0 auto 0 0;
  border-radius: 5px;
  padding: 5px 8px;
  margin-left: -4px;
  background-color: white;
  font-weight: 600;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
}
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value .add-license-input.error-input {
  background-color: rgb(252, 244, 244);
  box-shadow: 0px 1px 1px 0px rgba(138, 11, 11, 0.208), 0px 0px 0px 1px rgba(203, 42, 30, 0.344), 0px 2px 5px 0px rgba(181, 44, 34, 0.241);
}
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value .edit-license-button {
  min-width: 80px;
  height: 24px;
  min-height: 24px;
  line-height: 24px;
  margin-left: auto;
  font-size: 13px;
  font-weight: 600;
}
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value .license-button {
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  line-height: 30px;
  margin-left: 10px;
  font-size: 16px;
  font-weight: 600;
}
.add-licenses-modal .license-section .license-table .license-column .license-row .right-value .license-button:disabled {
  background-color: white;
}
.add-licenses-modal .license-section .license-table .license-column .license-row:last-child {
  border-bottom: none;
}
.add-licenses-modal .license-section .license-table .license-column .license-row .license-title {
  font-weight: 600;
  font-size: 14px;
}
.add-licenses-modal .license-section .license-table .license-column .license-value {
  display: flex;
  align-items: center;
  gap: 10px;
}
.add-licenses-modal .license-section .license-table .license-column .license-value .license-button {
  min-width: 32px;
  height: 32px;
  padding: 0;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
}
.add-licenses-modal .license-section .license-table .license-column .license-value .license-input {
  width: 60px;
  padding: 5px;
  text-align: center;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.add-licenses-modal .info-section {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 8px 12px;
  border-radius: 8px;
  align-self: center;
  text-align: center;
  color: #334051;
  background-color: rgba(252, 254, 255, 0.968627451);
  border: 1px solid #d0d7e0;
}
.add-licenses-modal .info-section.faded {
  opacity: 0.7;
}
.add-licenses-modal .pricing-section {
  display: flex;
  flex-direction: column;
  background-color: white;
  padding: 0px;
  border-radius: 8px;
  border: 1px solid rgb(218, 220, 232);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}
.add-licenses-modal .pricing-section.faded {
  opacity: 0.7;
}
.add-licenses-modal .pricing-section .pricing-row {
  display: flex;
  flex-direction: row;
  flex: 1;
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
}
@media (max-width: 735px) {
  .add-licenses-modal .pricing-section .pricing-row {
    flex-direction: column;
  }
}
.add-licenses-modal .pricing-section .pricing-row .months-graphic {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 2px;
  padding-right: 16px;
}
.add-licenses-modal .pricing-section .pricing-row .months-graphic .month-container {
  display: flex;
  flex-direction: column;
  position: relative;
}
.add-licenses-modal .pricing-section .pricing-row .months-graphic .month-container .label {
  position: absolute;
  text-align: center;
  width: 100px;
  left: -36px;
  font-size: 11px;
}
.add-licenses-modal .pricing-section .pricing-row .months-graphic .month-container .label.current {
  top: -21px;
}
.add-licenses-modal .pricing-section .pricing-row .months-graphic .month-container .label.renewal {
  top: 25px;
}
.add-licenses-modal .pricing-section .pricing-row .months-graphic .month-container .month {
  height: 16px;
  width: 18px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  padding: 1px 4px;
  background-color: rgba(218, 220, 232, 0.5);
  border: 1px solid rgba(218, 220, 232, 0.8);
}
.add-licenses-modal .pricing-section .pricing-row .months-graphic .month-container .month.current::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 0px;
  top: -6px;
  height: 7px;
  border-left: 1px solid rgba(135, 183, 133, 0.8941176471);
}
.add-licenses-modal .pricing-section .pricing-row .months-graphic .month-container .month.renewal::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 0px;
  bottom: -6px;
  height: 7px;
  border-left: 1px solid rgba(135, 183, 133, 0.8941176471);
}
.add-licenses-modal .pricing-section .pricing-row .months-graphic .month-container .month.prorated-month {
  background-color: #D0E1CF;
  border: 1px solid rgba(135, 183, 133, 0.8941176471);
}
.add-licenses-modal .pricing-section .pricing-row .left-section {
  display: flex;
  gap: 2px;
  flex-direction: column;
  flex: 1;
  padding: 16px 20px;
}
.add-licenses-modal .pricing-section .pricing-row .left-section .green-badge {
  background-color: #D0E1CF;
  border: 1px solid rgba(135, 183, 133, 0.8941176471);
  padding: 1px 6px;
  font-size: 0.95em;
  border-radius: 4px;
  font-weight: 600;
}
.add-licenses-modal .pricing-section .pricing-row .left-section .symbol {
  opacity: 0.7;
  margin: 0 4px;
}
.add-licenses-modal .pricing-section .pricing-row .left-section .value {
  font-weight: 600;
}
.add-licenses-modal .pricing-section .pricing-row .right-section {
  display: flex;
  gap: 2px;
  flex-direction: column;
  width: 200px;
  border-left: 1px solid rgba(218, 220, 232, 0.8);
  padding: 16px 20px;
}
.add-licenses-modal .pricing-section .pricing-row .right-section .strike-through {
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  opacity: 0.5;
}
.add-licenses-modal .pricing-section .pricing-row .right-section .prorated-price {
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: #87B785;
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}
.add-licenses-modal .pricing-section .pricing-details,
.add-licenses-modal .pricing-section .pricing-summary {
  flex: 1;
  padding: 15px;
}
.add-licenses-modal .pricing-section .pricing-details .studio-plan,
.add-licenses-modal .pricing-section .pricing-summary .studio-plan {
  font-weight: 600;
  margin-bottom: 10px;
}
.add-licenses-modal .pricing-section .pricing-details .price-info,
.add-licenses-modal .pricing-section .pricing-details .renewal-info,
.add-licenses-modal .pricing-section .pricing-details .prorated-info,
.add-licenses-modal .pricing-section .pricing-summary .price-info,
.add-licenses-modal .pricing-section .pricing-summary .renewal-info,
.add-licenses-modal .pricing-section .pricing-summary .prorated-info {
  font-size: 14px;
  color: #666;
  margin-bottom: 10px;
}
.add-licenses-modal .pricing-section .pricing-details .old-price,
.add-licenses-modal .pricing-section .pricing-details .new-price,
.add-licenses-modal .pricing-section .pricing-details .due-now,
.add-licenses-modal .pricing-section .pricing-details .prorated-price,
.add-licenses-modal .pricing-section .pricing-summary .old-price,
.add-licenses-modal .pricing-section .pricing-summary .new-price,
.add-licenses-modal .pricing-section .pricing-summary .due-now,
.add-licenses-modal .pricing-section .pricing-summary .prorated-price {
  font-size: 16px;
  margin-bottom: 10px;
}
.add-licenses-modal .pricing-section .pricing-details .old-price:last-child,
.add-licenses-modal .pricing-section .pricing-details .new-price:last-child,
.add-licenses-modal .pricing-section .pricing-details .due-now:last-child,
.add-licenses-modal .pricing-section .pricing-details .prorated-price:last-child,
.add-licenses-modal .pricing-section .pricing-summary .old-price:last-child,
.add-licenses-modal .pricing-section .pricing-summary .new-price:last-child,
.add-licenses-modal .pricing-section .pricing-summary .due-now:last-child,
.add-licenses-modal .pricing-section .pricing-summary .prorated-price:last-child {
  margin-bottom: 0;
  font-weight: 600;
}
.add-licenses-modal .pricing-section .pricing-details .prorated-calculation,
.add-licenses-modal .pricing-section .pricing-summary .prorated-calculation {
  font-size: 12px;
  color: #666;
  margin-bottom: 10px;
}
.add-licenses-modal .payment-paths path {
  stroke: rgb(218, 220, 232);
  transition: all 0.3s ease;
}
.add-licenses-modal .payment-paths.glowing path {
  stroke: rgba(40, 135, 40, 0.6);
  filter: drop-shadow(0 2px 5px rgba(40, 135, 40, 0.8));
}
.add-licenses-modal .action-section {
  margin-top: 20px;
}
.add-licenses-modal .action-section md-button {
  background-color: #2ecc71;
  color: #fff;
  padding: 10px 20px;
  border-radius: 4px;
}
.add-licenses-modal .action-section md-button.md-primary:hover {
  background-color: #27ae60;
}
.add-licenses-modal .confirmation-text {
  font-size: 12px;
  color: #666;
  text-align: center;
  margin-top: 10px;
}
.add-licenses-modal .cancel-checkout {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 8px;
  cursor: pointer;
  opacity: 0.6;
}
.add-licenses-modal .cancel-checkout:hover {
  opacity: 1;
  text-decoration: underline;
}
.add-licenses-modal .checkout-completed {
  max-width: 370px;
  margin: 0 14px 14px 14px;
  border: 1px solid rgba(66, 112, 52, 0.3921568627);
  border-radius: 8px;
  padding: 14px;
  text-align: center;
  color: white;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.1882352941);
  background-color: #81b471;
}
.add-licenses-modal .checkout-completed-header {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 8px;
}
.add-licenses-modal .checkout-completed .licenses-summary {
  padding: 8px;
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.3);
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-radius: 8px;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}
.add-licenses-modal .checkout-completed-subtext {
  margin-bottom: 4px;
  opacity: 0.9;
}

.organization-stats-container {
  justify-content: space-evenly;
}

.organization-logo #dropZone {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
  border: 1px dashed #ccc;
  border-radius: 8px;
  width: fit-content;
  padding: 14px;
}
.organization-logo #dropZone .illustration {
  width: 40px;
  height: 40px;
  border-radius: 4px;
  background-color: rgb(245, 245, 248);
  display: flex;
  align-items: center;
  justify-content: center;
}
.organization-logo #dropZone .illustration svg {
  opacity: 0.8;
  max-width: 100%;
  max-height: 100%;
}
.organization-logo .active-logo {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: fit-content;
  border-radius: 8px;
  border: 1px solid rgba(218, 220, 232, 0.8);
}
.organization-logo .active-logo .logo-preview {
  background-color: rgb(246, 248, 250);
  border-radius: 8px 0 0 8px;
  padding: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 1px solid rgba(218, 220, 232, 0.8);
}
.organization-logo .active-logo .right-section {
  padding: 12px 14px;
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 100%;
  gap: 16px;
}

.organization-settings .disabled {
  opacity: 0.6;
  pointer-events: none;
}
.organization-settings .master-view .create-member .temporary-switch-container {
  display: flex;
  align-self: end;
  align-items: center;
  height: 34px;
  margin-right: 14px;
  margin-bottom: -1px;
  padding: 0px 12px;
  border-radius: 6px;
  border: 1px dashed lightgray;
  font-weight: 600;
}
.organization-settings .master-view .create-member .temporary-switch-container .temporary-input {
  width: 120px;
}
.organization-settings .master-view .create-member .temporary-switch-container .temporary-input .temporary-date md-icon {
  transform: rotate(-90deg);
}
.organization-settings .master-view .create-member .temporary-switch-container.enabled {
  border: 1px solid rgba(60, 66, 88, 0.2);
  background-color: rgb(255, 255, 255);
}
.organization-settings .master-view .members-header {
  gap: 8px;
  background-color: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(2px);
  z-index: 2;
  margin: 0 -20px;
  padding: 0 20px 16px 20px;
}
.organization-settings .master-view .members-header.sticky {
  position: sticky;
  top: 0;
  border-bottom: 1px solid rgba(218, 220, 232, 0.6);
}
.organization-settings .folder-details {
  position: relative;
}
.organization-settings .folder-details .batch-access {
  display: flex;
  align-items: end;
  z-index: 1;
  margin: 16px -20px 0 -20px;
  padding: 16px 20px 0 20px;
  border-top: 1px solid rgba(218, 220, 232, 0.8);
  backdrop-filter: blur(2px);
  background-color: rgba(255, 255, 255, 0.8);
}
@media (max-width: 735px) {
  .organization-settings .folder-details .batch-access {
    padding: 24px;
  }
}
.organization-settings .folder-details .batch-access .input-container {
  width: 280px;
}
@media (max-width: 735px) {
  .organization-settings .folder-details .batch-access .input-container {
    width: initial;
  }
}
.organization-settings .folder-details .batch-access.sticky {
  position: sticky;
  top: 0px;
}
.organization-settings .folder-details md-table-container .md-row.no-access {
  background-color: rgb(248, 248, 248);
}
.organization-settings .folder-details md-table-container .green-dot {
  display: inline-block;
  background-color: rgba(66, 178, 66, 0.8);
  border: 1px solid rgba(62, 160, 62, 0.9);
  border-radius: 50%;
  width: 6px;
  height: 6px;
  margin-right: 4px;
  margin-bottom: 1px;
}

dt-organization-member-details-page .floating-invite-container {
  position: fixed;
  padding: 20px 30px;
  border-radius: 8px 8px 0 0;
  margin-left: 16px;
  gap: 16px;
  bottom: -1px;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(2px);
  border: 1px solid rgba(218, 220, 232, 0.8);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 0px 6px -4px rgba(20, 60, 100, 0.15), 0px 0px 20px -12px rgba(45, 95, 150, 0.3);
}
dt-organization-member-details-page .floating-invite-container .md-button {
  height: 40px;
  margin: 0;
}
dt-organization-member-details-page .floating-invite-container .icon-button.dark {
  box-shadow: none;
  padding: 0 12px;
}
dt-organization-member-details-page .floating-invite-container .icon-button.dark:hover {
  box-shadow: none;
}
dt-organization-member-details-page .floating-invite-container .icon-button.dark:disabled .icon-button__text {
  opacity: 0.6;
}
dt-organization-member-details-page .floating-invite-container .icon-button.dark:disabled md-icon {
  opacity: 0.6;
}
dt-organization-member-details-page .floating-invite-container .icon-button.dark md-icon path {
  fill: white;
}
@media (max-width: 735px) {
  dt-organization-member-details-page .floating-invite-container {
    border-radius: 0;
    position: sticky;
    padding: 20px 16px;
    margin-left: 0;
    width: calc(100% - 32px);
  }
}

.projects-map-overview {
  display: flex;
  flex-direction: row;
  gap: 16px;
}
@media (max-width: 735px) {
  .projects-map-overview {
    flex-direction: column;
    gap: 0;
    margin-top: 16px !important;
  }
  .projects-map-overview .mapboxgl-ctrl-geocoder {
    display: none;
  }
}
.projects-map-overview .project-list {
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  min-width: 280px;
  flex: 0.3;
}
.projects-map-overview .project-list__header {
  font-weight: 600;
  padding: 16px 0 12px 0;
}
.projects-map-overview .project-list__container {
  padding-bottom: 16px;
  overflow: scroll;
}
.projects-map-overview .project-list__container .project-list__item {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px 0;
  border: 1px solid transparent;
}
.projects-map-overview .project-list__container .project-list__item:not(:first-child) {
  border-top: 1px solid rgba(218, 220, 232, 0.4);
}
.projects-map-overview .project-list__container .project-list__item {
  cursor: default;
}
.projects-map-overview .project-list__container .project-list__item.disabled {
  opacity: 0.6;
  pointer-events: none;
}
.projects-map-overview .project-list__container .project-list__item:hover + .project-list__item, .projects-map-overview .project-list__container .project-list__item.active + .project-list__item {
  border-top: 1px solid transparent;
}
.projects-map-overview .project-list__container .project-list__item:hover, .projects-map-overview .project-list__container .project-list__item.active {
  background-color: rgba(218, 220, 232, 0.25);
  border: 1px solid rgba(218, 220, 232, 0.6);
  border-radius: 6px;
}
.projects-map-overview .project-list__container .project-list__item:hover .actions, .projects-map-overview .project-list__container .project-list__item.active .actions {
  display: flex;
}
.projects-map-overview .project-list__container .project-list__item:hover .project-list__item-first-row-name, .projects-map-overview .project-list__container .project-list__item.active .project-list__item-first-row-name {
  font-weight: 600;
}
.projects-map-overview .project-list__container .project-list__item.active {
  background-color: rgba(218, 220, 232, 0.1);
}
.projects-map-overview .project-list__container .project-list__item-first-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  padding-left: 8px;
}
.projects-map-overview .project-list__container .project-list__item-first-row-name.has-location {
  font-weight: 600;
}
.projects-map-overview .project-list__container .project-list__item-first-row .location-indicator {
  margin-left: 4px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: rgba(165, 165, 165, 0.5);
  border: 1px solid rgba(165, 165, 165, 0.8);
}
.projects-map-overview .project-list__container .project-list__item-first-row .location-indicator.has-location {
  background-color: #58ADEA;
  border: 1px solid #438ec3;
}
.projects-map-overview .project-list__container .project-list__item .actions {
  display: none;
  justify-content: start;
  gap: 4px;
  padding-left: 8px;
  margin-bottom: 2px;
}
.projects-map-overview .project-list__container .project-list__item .actions.active {
  display: flex;
  flex-direction: column;
}
.projects-map-overview .mapboxgl-popup-tip {
  opacity: 0.8;
  opacity: 1;
}
.projects-map-overview .mapboxgl-popup-tip.fade-out {
  opacity: 0;
}
.projects-map-overview .mapboxgl-popup-content {
  padding: 16px 18px;
  border-radius: 8px;
  backdrop-filter: blur(2px);
  background: rgba(255, 255, 255, 0.8);
  opacity: 1;
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}
.projects-map-overview .mapboxgl-popup-content .popup-content {
  font-family: "Open Sans", sans-serif;
  min-width: 150px;
  font-size: 13px;
  line-height: 20px;
  padding: 0px;
  display: flex;
  flex-direction: column;
}
.projects-map-overview .mapboxgl-popup-content .popup-content .popup-title {
  font-weight: 600;
}
.projects-map-overview .mapboxgl-popup-content .popup-content .icon-button {
  display: flex;
  justify-content: center;
  margin-left: 0;
  margin-top: 8px;
  margin-bottom: 2px;
  cursor: pointer;
}
.projects-map-overview .mapboxgl-popup-content.fade-out {
  opacity: 0;
}

.alerts-projects-overview {
  display: flex;
  flex-direction: row;
  gap: 24px;
  margin-top: 24px;
}
@media (max-width: 735px) {
  .alerts-projects-overview {
    flex-direction: column-reverse;
    gap: 0;
    margin-top: 0px !important;
  }
  .alerts-projects-overview .mapboxgl-ctrl-geocoder {
    display: none;
  }
}
.alerts-projects-overview .header-buttons {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}
@media (max-width: 735px) {
  .alerts-projects-overview .header-buttons {
    margin: 12px 8px 0 8px;
  }
}
.alerts-projects-overview .header-buttons .segmented-control {
  display: flex;
  flex-direction: row;
  flex: 1;
}
.alerts-projects-overview .header-buttons .segmented-control .separator {
  width: 1px;
  background-color: rgba(0, 0, 0, 0.1);
}
.alerts-projects-overview .header-buttons .segmented-control__item {
  flex: 1;
  justify-content: center;
  background-color: rgba(239, 241, 245, 0.5);
  padding: 8px;
  box-shadow: 0px 0px 0px 1px #dadce8;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 6px;
}
@media (max-width: 735px) {
  .alerts-projects-overview .header-buttons .segmented-control__item {
    padding: 8px;
  }
}
.alerts-projects-overview .header-buttons .segmented-control__item.left {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.alerts-projects-overview .header-buttons .segmented-control__item.right {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
.alerts-projects-overview .header-buttons .segmented-control__item.active {
  background-color: white;
  font-weight: 600;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
  z-index: 1;
}
.alerts-projects-overview .header-buttons .segmented-control__item .tab-icon {
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
}
.alerts-projects-overview .filters-header {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
  padding: 0;
  z-index: 2;
}
.alerts-projects-overview .filters-wrapper {
  overflow: hidden;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid rgb(218, 220, 232);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}
.alerts-projects-overview .filters-wrapper .filters-header {
  padding: 10px 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
}
.alerts-projects-overview .filters-wrapper .filter-section:not(:last-child) {
  border-bottom: 1px solid rgba(218, 220, 232, 0.7);
}
.alerts-projects-overview .filters-wrapper .filter-section {
  font-weight: 600;
}
.alerts-projects-overview .filters-wrapper .filter-section.disabled-section {
  pointer-events: none;
  opacity: 0.6;
}
.alerts-projects-overview .filters-wrapper .filter-section .section-name {
  margin: 0;
  padding-bottom: 10px;
  user-select: none;
}
.alerts-projects-overview .filters-wrapper .filter-section .options-section {
  border-top: 1px solid rgba(218, 220, 232, 0.7);
  background-color: rgb(246, 248, 250);
  padding: 4px 8px 10px 8px;
  transition: max-height 0.3s ease 0s, padding 0.3s ease 0s;
  max-height: 1000px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.alerts-projects-overview .filters-wrapper .filter-section .options-section.hidden {
  max-height: 0;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.alerts-projects-overview .filters-wrapper .filter-section .options-section .option-name {
  margin: 0;
  font-weight: normal;
  font-size: 13px;
}
.alerts-projects-overview .left-container-section {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 440px;
  max-width: 600px;
  min-height: calc(100vh - 140px);
  flex: 0.4;
  align-self: stretch;
}
@media (max-width: 735px) {
  .alerts-projects-overview .left-container-section {
    min-width: 100%;
    max-width: 100%;
  }
}
.alerts-projects-overview .left-container-section .project-list {
  display: flex;
  flex-direction: column;
  overflow: scroll;
  height: 80vh;
  gap: 14px;
}
.alerts-projects-overview .left-container-section .project-list__header {
  display: flex;
  flex-direction: row;
  border: 1px solid rgba(218, 220, 232, 0.8);
  justify-content: space-evenly;
  border-radius: 6px;
  font-weight: 600;
}
.alerts-projects-overview .left-container-section .project-list__header .item {
  padding: 8px 16px;
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: 6px;
  text-wrap: nowrap;
}
.alerts-projects-overview .left-container-section .project-list__header .item md-icon {
  margin: 0;
}
.alerts-projects-overview .left-container-section .project-list__header .item.center {
  border-left: 1px solid rgba(218, 220, 232, 0.8);
  border-right: 1px solid rgba(218, 220, 232, 0.8);
}
.alerts-projects-overview .left-container-section .project-list__time-picker-and-summary {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 26px;
}
.alerts-projects-overview .left-container-section .project-list__time-picker-and-summary .log-summary {
  display: flex;
  flex: 1;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 16px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 6px;
  font-weight: 600;
}
.alerts-projects-overview .left-container-section .project-list__time-picker-and-summary .log-summary span {
  display: flex;
  align-items: center;
  text-align: center;
}
.alerts-projects-overview .left-container-section .project-list__container {
  padding-bottom: 16px;
}
.alerts-projects-overview .left-container-section .project-list__container .table-header {
  display: flex;
  justify-content: space-between;
  font-weight: 600;
  font-size: 0.9em;
  opacity: 0.8;
  padding: 0 14px 8px 14px;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  padding: 8px;
  border: 1px solid transparent;
  border-left: 3px solid transparent;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item:not(:first-child) {
  border-top: 1px solid rgba(218, 220, 232, 0.4);
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item {
  cursor: default;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item.disabled {
  opacity: 0.6;
  pointer-events: none;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item {
  opacity: 0.9;
  transition: border-color 0.16s ease-out;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item:hover, .alerts-projects-overview .left-container-section .project-list__container .project-list__item.active {
  cursor: pointer;
  background-color: rgba(95, 163, 108, 0.05);
  border-left: 3px solid rgba(96, 182, 100, 0.8);
  border-top: 1px solid rgba(96, 182, 100, 0.3);
  border-bottom: 1px solid rgba(96, 182, 100, 0.3);
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item:hover:not(.active) + .project-list__item:not(.active), .alerts-projects-overview .left-container-section .project-list__container .project-list__item.active:not(.active) + .project-list__item:not(.active) {
  border-top: 1px solid transparent;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item:hover, .alerts-projects-overview .left-container-section .project-list__container .project-list__item.active {
  opacity: 1;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item:hover.has-alerts, .alerts-projects-overview .left-container-section .project-list__container .project-list__item.active.has-alerts {
  background-color: rgba(236, 106, 62, 0.08);
  border-top: 1px solid rgba(236, 106, 62, 0.16);
  border-bottom: 1px solid rgba(236, 106, 62, 0.16);
  border-left: 3px solid #EC6A3E;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item.active + .project-list__item {
  border-top: 1px solid transparent;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item.active .alert-summary.no-alerts {
  background-color: white;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item.active .actions {
  display: flex;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item.active {
  font-weight: 600;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item-first-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-left: 2px;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item-first-row-name.has-location {
  font-weight: 600;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item-first-row .location-indicator {
  margin-left: 4px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: rgba(165, 165, 165, 0.5);
  border: 1px solid rgba(165, 165, 165, 0.8);
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item-first-row .location-indicator.has-location {
  background-color: #58ADEA;
  border: 1px solid #438ec3;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item-first-row .icon {
  width: 18px;
  height: 18px;
  border: 1px solid rgb(218, 220, 232);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(220, 114, 74, 0.06);
  border-color: #DC724A;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item .actions {
  display: none;
  justify-content: space-between;
  gap: 4px;
  margin-top: 8px;
  margin-left: -8px;
  margin-right: -8px;
  padding: 12px 8px 4px 8px;
  border-top: 1px solid rgba(96, 182, 100, 0.4);
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item .actions.active {
  display: flex;
  flex-direction: column;
}
.alerts-projects-overview .left-container-section .project-list__container .project-list__item.has-alerts .actions {
  border-top: 1px solid rgba(236, 106, 62, 0.3);
}
.alerts-projects-overview .right-container-section {
  display: flex;
  flex: 1;
  flex-direction: column;
}
.alerts-projects-overview .right-container-section .map-section {
  min-height: 50vh;
  flex: 0 1;
  border: 5px solid rgba(255, 255, 255, 0.8);
  border-radius: 12px;
  background-color: rgb(246, 241, 240);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 10px 24px -12px rgba(45, 95, 150, 0.25);
}
@media (max-width: 735px) {
  .alerts-projects-overview .right-container-section .map-section {
    min-height: 40vh;
    margin-top: 0 !important;
  }
}
.alerts-projects-overview .right-container-section .map-section #map {
  transition: filter 0.2s ease-out;
}
.alerts-projects-overview .right-container-section .map-section #map.no-location {
  filter: brightness(0.8);
  pointer-events: none;
}
.alerts-projects-overview .right-container-section .map-section .confirm-dialog-container.centered {
  display: flex;
  position: relative;
  align-self: center;
  margin: 0 auto;
  padding: 18px 22px;
}
.alerts-projects-overview .right-container-section .map-section .confirm-dialog-container.centered .buttons {
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.8);
  background-color: rgba(255, 255, 255, 0.7);
  flex-direction: column;
  text-align: center;
}
.alerts-projects-overview .right-container-section .map-section .confirm-dialog-container .buttons {
  background-color: rgba(255, 255, 255, 0.5);
}
.alerts-projects-overview .right-container-section .alerts-list-container .header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
  margin-bottom: 14px;
}
@media (max-width: 735px) {
  .alerts-projects-overview .right-container-section .alerts-list-container .header {
    flex-direction: column;
    gap: 12px;
    align-items: start;
    padding: 0 12px;
  }
}
.alerts-projects-overview .right-container-section .alerts-list-container .header .left-section {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
  margin-left: 6px;
}
.alerts-projects-overview .right-container-section .alerts-list-container .header .left-section .project-name {
  font-size: 14px;
  font-weight: 600;
}
.alerts-projects-overview .right-container-section .alerts-list-container .header .right-section {
  display: flex;
  flex-direction: row;
  gap: 16px;
}
@media (max-width: 735px) {
  .alerts-projects-overview .right-container-section .alerts-list-container .header .right-section {
    gap: 8px;
  }
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts-summary .total {
  margin-top: -1px;
  display: flex;
  background-color: rgba(255, 255, 255, 0);
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px 12px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 6px;
  font-weight: 600;
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts-summary .total span {
  display: flex;
  align-items: center;
  text-align: center;
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts-summary .total:hover {
  cursor: pointer;
  box-shadow: 0 2px 4px -3px rgba(0, 0, 0, 0.168627451);
  background-color: white;
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts-summary .total.active {
  background-color: white;
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts-summary .rule {
  display: flex;
  background-color: rgba(255, 255, 255, 0);
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 6px;
  font-weight: 400;
  transition: 0.15s ease all;
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts-summary .rule:hover {
  cursor: pointer;
  box-shadow: 0 2px 4px -3px rgba(0, 0, 0, 0.168627451);
  background-color: white;
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts-summary .rule.active {
  font-weight: 600;
  border: 1px solid rgba(75, 158, 250, 0.8);
  background-color: rgb(248, 252, 255);
  box-shadow: 0 2px 4px -3px rgba(0, 0, 0, 0.168627451);
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts-summary .rule .rule-alert-count {
  opacity: 1;
  border-right: 1px solid #dadce8;
  padding-right: 6px;
  font-weight: 600;
}
.alerts-projects-overview .right-container-section .alerts-list-container .alerts {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.alerts-projects-overview .right-container-section .alerts-list .grid-container {
  grid-template-columns: 1fr 0fr 0.6fr 0fr auto;
}
.alerts-projects-overview .mapboxgl-popup {
  max-width: 320px !important;
}
.alerts-projects-overview .mapboxgl-popup-tip {
  opacity: 0.8;
  opacity: 1;
}
.alerts-projects-overview .mapboxgl-popup-tip.fade-out {
  opacity: 0;
}
.alerts-projects-overview .mapboxgl-popup-content {
  padding: 16px 18px;
  border-radius: 8px;
  backdrop-filter: blur(2px);
  background: rgba(255, 255, 255, 0.8);
  opacity: 1;
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}
.alerts-projects-overview .mapboxgl-popup-content .popup-content {
  font-family: "Open Sans", sans-serif;
  min-width: 150px;
  font-size: 13px;
  line-height: 20px;
  padding: 0px;
  display: flex;
  flex-direction: column;
}
.alerts-projects-overview .mapboxgl-popup-content .popup-content .popup-title {
  font-weight: 600;
}
.alerts-projects-overview .mapboxgl-popup-content .popup-content .icon-button {
  display: flex;
  justify-content: center;
  margin-left: 0;
  margin-top: 8px;
  margin-bottom: 2px;
  cursor: pointer;
}
.alerts-projects-overview .mapboxgl-popup-content.fade-out {
  opacity: 0;
}
.alerts-projects-overview .alerts-list .item.description .dt-badge.location {
  background-color: rgba(220, 220, 220, 0.1);
  font-size: 0.9em;
}
.alerts-projects-overview .alerts-list .item.description .dt-badge.location:hover {
  cursor: pointer;
  background-color: rgba(220, 220, 220, 0.4);
  color: rgba(21, 57, 76, 0.95);
}
.alerts-projects-overview .alerts-list .item.description .dt-badge.location md-icon {
  padding-bottom: 2px;
  margin-right: 4px;
}
.alerts-projects-overview .alerts-list .item.description .dt-badge.location md-icon path {
  fill: rgba(21, 57, 76, 0.6);
}
.alerts-projects-overview .alerts-list .item.description .alert-button {
  display: flex;
  align-items: center;
  gap: 2px;
}
.alerts-projects-overview .alerts-list .item.description .alert-button md-icon path {
  transform: translateY(0);
}
.alerts-projects-overview .alerts-list .item.resolved .icon {
  width: 26px;
  min-width: 26px;
  height: 26px;
  border: 1px solid rgb(218, 220, 232);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.alerts-projects-overview .alerts-list .item.resolved .icon.alert-open {
  background-color: rgba(220, 114, 74, 0.06);
  border-color: #DC724A;
}
.alerts-projects-overview .alerts-list .item.resolved .icon.alert-ack {
  background-color: #EFF1F5;
  border-color: rgba(21, 57, 76, 0.2);
}
.alerts-projects-overview .alerts-list .item.resolved .icon.alert-corrective-action {
  background-color: rgba(115, 166, 223, 0.06);
  border-color: #73A6DF;
}
.alerts-projects-overview .alerts-list .item.resolved .icon md-icon {
  width: 14px;
  height: 14px;
  min-height: 14px;
  min-width: 14px;
}
.alerts-projects-overview .alert-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  align-self: center;
  height: 18px;
  gap: 10px;
  padding: 4px 10px;
  background-color: white;
  border: 1px solid rgba(218, 220, 232, 0.8);
  border-radius: 6px;
  font-weight: 600;
  font-size: 0.95em;
  opacity: 0.95;
}
.alerts-projects-overview .alert-summary span {
  display: flex;
  align-items: center;
  gap: 4px;
}
.alerts-projects-overview .alert-summary.no-alerts {
  border: 1px solid rgba(95, 155, 85, 0.7);
  background-color: rgba(95, 155, 85, 0.05);
  color: rgb(53, 99, 44);
  transform: scale(0.95) translateX(1px);
}

.exit-alert-overview-button {
  margin: 0;
  position: absolute;
  top: 44px;
  right: 30px;
}
.exit-alert-overview-button md-icon {
  margin-right: 2px;
}
@media (max-width: 735px) {
  .exit-alert-overview-button {
    min-width: 38px;
    top: 28px;
    right: 20px;
  }
  .exit-alert-overview-button md-icon {
    margin-right: 0;
  }
}

.master-detail-container .content-box.master-view .search-panel {
  background: white;
}
.master-detail-container .content-box.master-view .search-panel dt-search-box {
  max-width: none;
}
@media (max-width: 768px) {
  .master-detail-container .content-box.master-view .search-panel {
    gap: 0 !important;
  }
  .master-detail-container .content-box.master-view .search-panel dt-search-box {
    flex: 1 !important;
    width: 100% !important;
  }
  .master-detail-container .content-box.master-view .search-panel #columnConfigButton,
  .master-detail-container .content-box.master-view .search-panel md-menu {
    display: none !important;
  }
}
.master-detail-container .content-box.master-view .results-summary {
  padding: 12px 0;
  font-size: 14px;
  color: #697878;
}
.master-detail-container .content-box.master-view .results-summary span {
  margin: 0;
}
.master-detail-container .content-box.master-view .filter-panel {
  padding: 12px 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
}
.master-detail-container .content-box.master-view .filter-panel .filter-panel__item {
  display: flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  gap: 4px;
  padding: 2px 8px;
  border: 1px solid rgb(218, 220, 232);
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.master-detail-container .content-box.master-view .filter-panel .filter-panel__item:hover {
  background-color: rgb(246, 248, 250);
}
.master-detail-container .content-box.master-view .filter-panel .filter-panel__item .filter-separator {
  margin: 0 4px;
  color: #697878;
  opacity: 0.6;
}
.master-detail-container .content-box.master-view .filter-panel .filter-panel__item .filter-active-text {
  color: #207da9;
  font-weight: 600;
}
.master-detail-container .content-box.master-view .filter-panel .filter-panel__item--active {
  background-color: aliceblue;
  border-color: rgba(32, 125, 169, 0.3);
}
.master-detail-container .content-box.master-view .loading-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
}
.master-detail-container .content-box.master-view dt-paginator {
  background: white;
  border-top: 1px solid rgb(218, 220, 232);
}
.master-detail-container .content-box.master-view .export-menu md-menu-item {
  min-height: 40px;
}
.master-detail-container .content-box.master-view .export-menu md-menu-item md-icon {
  margin-right: 12px;
}
.master-detail-container .content-box.master-view md-table-container {
  background: white;
}
.master-detail-container .content-box.master-view md-table-container table {
  table-layout: fixed;
}
.master-detail-container .content-box.master-view md-table-container table.md-table:not(.md-row-select) td.md-cell:nth-child(n+2):nth-last-child(n+2),
.master-detail-container .content-box.master-view md-table-container table.md-table:not(.md-row-select) th.md-column:nth-child(n+2):nth-last-child(n+2) {
  padding-right: 16px;
}
.master-detail-container .content-box.master-view md-table-container table .md-column-checkbox {
  width: 32px;
  min-width: 32px;
  padding-left: 16px;
  padding-right: 4px;
}
.master-detail-container .content-box.master-view md-table-container table .md-column-icon {
  width: 40px;
  min-width: 40px;
  padding-left: 8px;
  padding-right: 4px;
}
.master-detail-container .content-box.master-view md-table-container table .md-cell-checkbox {
  width: 32px;
  min-width: 32px;
  padding-left: 16px;
  padding-right: 4px;
}
.master-detail-container .content-box.master-view md-table-container table .md-cell-icon {
  width: 40px;
  min-width: 40px;
  padding-left: 8px;
  padding-right: 4px;
}
.master-detail-container .content-box.master-view md-table-container table .md-cell.cell--right-align,
.master-detail-container .content-box.master-view md-table-container table .md-column.cell--right-align {
  text-align: right;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell {
  display: flex;
  flex-direction: row;
  gap: 2px;
  align-items: center;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-name {
  color: #15394C;
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-id {
  font-size: 12px;
  color: #697878;
  font-family: "Menlo", "monospace", "Open Sans";
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-badges {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info {
  margin-top: 4px;
  font-size: 12px;
  color: #697878;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info .device-project,
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info .device-status {
  display: inline-block;
  margin-right: 12px;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info .device-project:before,
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info .device-status:before {
  content: "• ";
  margin-right: 4px;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info .device-project:first-child:before,
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info .device-status:first-child:before {
  content: "";
  margin-right: 0;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info .device-status.online {
  color: #57802f;
}
.master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info .device-status.offline {
  color: #697878;
}
.master-detail-container .content-box.master-view md-table-container table .device-state .text-state {
  font-size: 14px;
  color: #15394C;
}
.master-detail-container .content-box.master-view md-table-container table .device-state .text-state .online {
  color: #57802f;
}
.master-detail-container .content-box.master-view md-table-container table .device-state .text-state .offline {
  color: #697878;
}
.master-detail-container .content-box.master-view md-table-container table .device-state.cell--muted {
  opacity: 0.6;
}
.master-detail-container .content-box.master-view md-table-container table .last-seen {
  color: #697878;
}
.master-detail-container .content-box.master-view md-table-container table .last-seen.muted {
  opacity: 0.7;
}
.master-detail-container .content-box.master-view md-table-container table .project-name {
  color: #15394C;
}

.project-filter-popover {
  min-width: 400px !important;
  max-width: 400px;
}
.project-filter-popover .popover__header {
  background-color: rgb(246, 248, 250);
  border-bottom: 1px solid rgb(218, 220, 232);
  display: flex;
  align-items: center;
  padding: 10px 14px;
}
.project-filter-popover .popover__header .header-text {
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}
.project-filter-popover .popover__header .icon-button {
  margin: 0;
}
.project-filter-popover .content {
  padding: 12px;
  max-height: 500px;
  overflow-y: auto;
}
.project-filter-popover .filter-mode-description {
  font-size: 12px;
  color: #697878;
  line-height: 1.4;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgb(218, 220, 232);
}
.project-filter-popover .project-search {
  margin-bottom: 12px;
}
.project-filter-popover .project-search .project-search-input {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid rgb(218, 220, 232);
  border-radius: 4px;
  font-size: 13px;
  color: #15394C;
  outline: none;
  box-sizing: border-box;
}
.project-filter-popover .project-search .project-search-input:focus {
  border-color: #207da9;
  box-shadow: 0 0 0 1px #207da9;
}
.project-filter-popover .project-search .project-search-input::placeholder {
  color: #697878;
  opacity: 0.6;
}
.project-filter-popover .project-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.project-filter-popover .project-item {
  padding: 0 12px;
  cursor: pointer;
}
.project-filter-popover .project-item:hover {
  background-color: rgb(246, 248, 250);
}
.project-filter-popover .project-item md-checkbox {
  margin: 0;
  min-height: 30px;
  width: 100%;
}
.project-filter-popover .project-item md-checkbox .md-label {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-left: 30px;
}
.project-filter-popover .project-item .project-name {
  font-size: 14px;
  color: #15394C;
}
.project-filter-popover .project-item .project-id {
  font-size: 12px;
  color: #697878;
}
.project-filter-popover .popover__footer {
  border-top: 1px solid rgb(218, 220, 232);
  padding: 8px 12px;
  background-color: transparent;
  width: auto;
}
.project-filter-popover .popover__footer .popover__footer-control {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.project-filter-popover .popover__footer .popover__footer-control .icon-button {
  margin: 0;
}

.device-type-filter-popover {
  min-width: 240px;
}
.device-type-filter-popover .popover__header {
  background-color: rgb(246, 248, 250);
  border-bottom: 1px solid rgb(218, 220, 232);
  display: flex;
  align-items: center;
  padding: 10px 14px;
}
.device-type-filter-popover .popover__header .header-text {
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}
.device-type-filter-popover .content {
  overflow-y: auto;
  padding-bottom: 8px;
}
.device-type-filter-popover .content .filter-item {
  padding: 0 12px;
}
.device-type-filter-popover .content .filter-item md-checkbox {
  min-height: 30px;
}
.device-type-filter-popover .content .filter-item md-checkbox .md-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-left: 30px;
}
.device-type-filter-popover .content .filter-item md-checkbox .md-label .filter-name {
  font-size: 14px;
  color: #15394C;
}
.device-type-filter-popover .popover__footer {
  border-top: 1px solid rgb(218, 220, 232);
  padding: 8px 12px;
  background-color: transparent;
  width: auto;
}
.device-type-filter-popover .popover__footer .popover__footer-control {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.device-type-filter-popover .popover__footer .popover__footer-control .icon-button {
  margin: 0;
}

.label-filter-popover,
.project-label-filter-popover {
  min-width: 380px;
  overflow: visible !important;
}
.label-filter-popover .popover__header,
.project-label-filter-popover .popover__header {
  background-color: rgb(246, 248, 250);
  border-bottom: 1px solid rgb(218, 220, 232);
  border-radius: 4px 4px 0 0;
  display: flex;
  align-items: center;
  padding: 10px 14px;
}
.label-filter-popover .popover__header .header-text,
.project-label-filter-popover .popover__header .header-text {
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}
.label-filter-popover .popover__header .icon-button,
.project-label-filter-popover .popover__header .icon-button {
  margin: 0;
}
.label-filter-popover .content,
.project-label-filter-popover .content {
  overflow: visible;
  max-height: 400px;
  padding: 12px;
}
.label-filter-popover .content .label-row,
.project-label-filter-popover .content .label-row {
  margin-bottom: 8px;
}
.label-filter-popover .content .label-row:last-child,
.project-label-filter-popover .content .label-row:last-child {
  margin-bottom: 0;
}
.label-filter-popover .content .label-row .label-inputs,
.project-label-filter-popover .content .label-row .label-inputs {
  display: flex;
  align-items: center;
}
.label-filter-popover .content .label-row .label-inputs .input-container,
.project-label-filter-popover .content .label-row .label-inputs .input-container {
  flex: 1;
  position: relative;
}
.label-filter-popover .content .label-row .label-inputs .input-container:first-child,
.project-label-filter-popover .content .label-row .label-inputs .input-container:first-child {
  min-width: 120px;
  margin-right: 12px;
}
.label-filter-popover .content .label-row .label-inputs .input-container .input-element,
.project-label-filter-popover .content .label-row .label-inputs .input-container .input-element {
  padding: 2px 8px;
  height: 28px;
  border-radius: 4px;
  outline: none;
  transition: border-color 0.2s ease;
}
.label-filter-popover .content .label-row .label-inputs .input-container .input-element:focus,
.project-label-filter-popover .content .label-row .label-inputs .input-container .input-element:focus {
  border-color: #207da9;
}
.label-filter-popover .content .label-row .label-inputs .input-container .input-element::placeholder,
.project-label-filter-popover .content .label-row .label-inputs .input-container .input-element::placeholder {
  color: #697878;
  opacity: 0.6;
}
.label-filter-popover .content .label-row .label-inputs .remove-button,
.project-label-filter-popover .content .label-row .label-inputs .remove-button {
  flex-shrink: 0;
  margin: 0;
  width: 32px;
  height: 32px;
}
.label-filter-popover .content .label-row .label-inputs .remove-button md-icon,
.project-label-filter-popover .content .label-row .label-inputs .remove-button md-icon {
  opacity: 0.6;
}
.label-filter-popover .content .label-row .label-inputs .remove-button:hover md-icon,
.project-label-filter-popover .content .label-row .label-inputs .remove-button:hover md-icon {
  opacity: 1;
}
.label-filter-popover .content .label-autocomplete-dropdown .dropdown-item-hover,
.project-label-filter-popover .content .label-autocomplete-dropdown .dropdown-item-hover {
  background-color: #f5f5f5 !important;
}
.label-filter-popover .popover__footer,
.project-label-filter-popover .popover__footer {
  border-top: 1px solid rgb(218, 220, 232);
  padding: 8px 12px;
  background-color: transparent;
  width: auto;
}
.label-filter-popover .popover__footer .popover__footer-control,
.project-label-filter-popover .popover__footer .popover__footer-control {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.label-filter-popover .popover__footer .popover__footer-control .icon-button,
.project-label-filter-popover .popover__footer .popover__footer-control .icon-button {
  margin: 0;
}

.paused-alerts-filter-popover {
  min-width: 280px;
}
.paused-alerts-filter-popover .popover__header {
  background-color: rgb(246, 248, 250);
  border-bottom: 1px solid rgb(218, 220, 232);
  display: flex;
  align-items: center;
  padding: 10px 14px;
}
.paused-alerts-filter-popover .popover__header .header-text {
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}
.paused-alerts-filter-popover .popover__footer {
  border-top: 1px solid rgb(218, 220, 232);
  padding: 8px 12px;
  background-color: transparent;
  width: auto;
}
.paused-alerts-filter-popover .popover__footer .popover__footer-control {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.paused-alerts-filter-popover .popover__footer .popover__footer-control .icon-button {
  margin: 0;
}

.emulator-filter-popover {
  min-width: 260px;
}
.emulator-filter-popover .popover__header {
  background-color: rgb(246, 248, 250);
  border-bottom: 1px solid rgb(218, 220, 232);
  display: flex;
  align-items: center;
  padding: 10px 14px;
}
.emulator-filter-popover .popover__header .header-text {
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}
.emulator-filter-popover .popover__footer {
  border-top: 1px solid rgb(218, 220, 232);
  padding: 8px 12px;
  background-color: transparent;
  width: auto;
}
.emulator-filter-popover .popover__footer .popover__footer-control {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.emulator-filter-popover .popover__footer .popover__footer-control .icon-button {
  margin: 0;
}

.activation-filter-popover {
  min-width: 240px;
}
.activation-filter-popover .popover__header {
  background-color: rgb(246, 248, 250);
  border-bottom: 1px solid rgb(218, 220, 232);
  display: flex;
  align-items: center;
  padding: 10px 14px;
}
.activation-filter-popover .popover__header .header-text {
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}
.activation-filter-popover .content {
  overflow-y: auto;
  padding-bottom: 8px;
}
.activation-filter-popover .content .filter-item {
  padding: 0 12px;
}
.activation-filter-popover .content .filter-item md-checkbox {
  min-height: 30px;
}
.activation-filter-popover .content .filter-item md-checkbox .md-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-left: 30px;
}
.activation-filter-popover .content .filter-item md-checkbox .md-label .filter-name {
  font-size: 14px;
  color: #15394C;
}
.activation-filter-popover .popover__footer {
  border-top: 1px solid rgb(218, 220, 232);
  padding: 8px 12px;
  background-color: transparent;
  width: auto;
}
.activation-filter-popover .popover__footer .popover__footer-control {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.activation-filter-popover .popover__footer .popover__footer-control .icon-button {
  margin: 0;
}

.column-config-popover {
  min-width: 380px;
  overflow: visible !important;
}
.column-config-popover .popover__header {
  background-color: rgb(246, 248, 250);
  border-bottom: 1px solid rgb(218, 220, 232);
  border-radius: 4px 4px 0 0;
  display: flex;
  align-items: center;
  padding: 10px 14px;
}
.column-config-popover .popover__header .header-text {
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}
.column-config-popover .popover__header .icon-button {
  margin: 0;
}
.column-config-popover .content {
  overflow: visible;
  max-height: 400px;
  padding: 12px;
}
.column-config-popover .content .label-column-row {
  margin-bottom: 8px;
}
.column-config-popover .content .label-column-row:last-child {
  margin-bottom: 0;
}
.column-config-popover .content .label-column-row .label-column-inputs {
  display: flex;
  align-items: center;
  gap: 8px;
}
.column-config-popover .content .label-column-row .label-column-inputs .input-container {
  flex: 1;
  position: relative;
}
.column-config-popover .content .label-column-row .label-column-inputs .input-container input {
  min-width: 120px;
}
.column-config-popover .content .label-column-row .label-column-inputs .icon-button {
  flex-shrink: 0;
}
.column-config-popover .content .label-autocomplete-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: white;
  border: 1px solid rgb(218, 220, 232);
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  max-height: 200px;
  overflow-y: auto;
  z-index: 10000;
  margin-top: 4px;
}
.column-config-popover .content .label-autocomplete-dropdown > div {
  padding: 8px 12px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background-color 0.2s ease;
}
.column-config-popover .content .label-autocomplete-dropdown > div:hover, .column-config-popover .content .label-autocomplete-dropdown > div.dropdown-item-hover {
  background-color: rgb(246, 248, 250);
}
.column-config-popover .content .label-autocomplete-dropdown > div span:first-child {
  font-size: 14px;
  color: #15394C;
}
.column-config-popover .content .label-autocomplete-dropdown > div span:last-child {
  font-size: 12px;
  color: #697878;
  margin-left: 8px;
}
.column-config-popover .popover__footer {
  border-top: 1px solid rgb(218, 220, 232);
  padding: 8px 12px;
  background-color: transparent;
  width: auto;
}
.column-config-popover .popover__footer .popover__footer-control {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.column-config-popover .popover__footer .popover__footer-control .icon-button {
  margin: 0;
}

@media (max-width: 768px) {
  .master-detail-container .content-box.master-view .search-panel {
    padding: 12px 16px;
  }
  .master-detail-container .content-box.master-view .results-summary {
    padding: 8px 16px;
  }
  .master-detail-container .content-box.master-view md-table-container table .md-column-checkbox,
  .master-detail-container .content-box.master-view md-table-container table .md-cell-checkbox {
    width: 28px;
    min-width: 28px;
    padding-left: 12px;
    padding-right: 2px;
  }
  .master-detail-container .content-box.master-view md-table-container table .device-name-cell .device-mobile-info {
    display: block;
  }
}
@media (min-width: 769px) {
  .hide-desktop {
    display: none !important;
  }
}
@media (max-width: 768px) {
  .hide-mobile {
    display: none !important;
  }
}
.organization-alert-config .project-expanded {
  background-color: #f8f9fa !important;
  border: 1px solid #dee2e6 !important;
}
.organization-alert-config .project-expanded.project-last {
  border-bottom: 1px solid #dee2e6 !important;
}
.organization-alert-config .project-last {
  border-bottom: none !important;
}
.organization-alert-config .contact-group-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.organization-alert-config .contact-group-form {
  display: flex;
  gap: 12px;
}
.organization-alert-config .contact-group-name-input {
  flex: 1;
}
.organization-alert-config .contact-group-desc-input {
  flex: 1;
}
.organization-alert-config .contact-group-create-button {
  align-self: flex-end;
}
@media (max-width: 600px) {
  .organization-alert-config .contact-group-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .organization-alert-config .contact-group-description {
    margin: 4px 0 0 0 !important;
  }
  .organization-alert-config .contact-group-info-button {
    margin-left: 0 !important;
  }
  .organization-alert-config .contact-group-form {
    flex-direction: column;
    gap: 12px;
  }
  .organization-alert-config .contact-group-name-input,
  .organization-alert-config .contact-group-desc-input {
    flex: none;
  }
  .organization-alert-config .contact-group-create-button {
    align-self: stretch;
    width: 100%;
  }
}
.organization-alert-config .corrective-actions-table {
  border: 1px solid #e9ecef;
  border-radius: 8px;
  overflow: hidden;
  background-color: white;
}

md-dialog.bulk-edit-modal .bulk-edit-upload-section {
  padding: 24px;
}
md-dialog.bulk-edit-modal .bulk-edit-template-section {
  background-color: #f8f9fa;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  margin-bottom: 24px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
}
md-dialog.bulk-edit-modal .bulk-edit-download-section {
  padding: 24px;
  flex: 0.6;
  border-right: 1px dashed #dee2e6;
}
md-dialog.bulk-edit-modal .bulk-edit-download-content {
  margin-bottom: 16px;
}
md-dialog.bulk-edit-modal .bulk-edit-section-title {
  margin: 0 0 8px 0;
  font-size: 16px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
}
md-dialog.bulk-edit-modal .bulk-edit-section-title .dt-badge {
  transform: scale(0.85);
}
md-dialog.bulk-edit-modal .bulk-edit-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  background-color: #76afdd;
  border: 1px solid #699aad;
  color: white;
  border-radius: 50%;
  font-size: 13px;
  font-weight: 600;
  flex-shrink: 0;
}
md-dialog.bulk-edit-modal .bulk-edit-section-description {
  margin: 0 0 12px 0;
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
  line-height: 1.5;
}
md-dialog.bulk-edit-modal .bulk-edit-feature-list {
  margin: 0;
  padding-left: 16px;
  color: rgba(0, 0, 0, 0.7);
  font-size: 13px;
  line-height: 1.4;
}
md-dialog.bulk-edit-modal .bulk-edit-feature-list li {
  margin-bottom: 4px;
}
md-dialog.bulk-edit-modal .bulk-edit-instructions-section {
  padding: 24px;
  flex: 1;
}
md-dialog.bulk-edit-modal .bulk-edit-instructions-content {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
md-dialog.bulk-edit-modal .bulk-edit-info-icon {
  color: #1976d2;
  font-size: 20px;
  margin-top: 2px;
  flex-shrink: 0;
}
md-dialog.bulk-edit-modal .bulk-edit-instructions-text {
  flex: 1;
}
md-dialog.bulk-edit-modal .bulk-edit-instructions-title {
  font-weight: 600;
  margin-bottom: 8px;
  font-size: 14px;
  color: #1976d2;
}
md-dialog.bulk-edit-modal .bulk-edit-instructions-list {
  margin: 0;
  padding-left: 20px;
  color: rgba(0, 0, 0, 0.8);
  font-size: 13px;
  line-height: 1.5;
}
md-dialog.bulk-edit-modal .bulk-edit-instructions-list li {
  margin-bottom: 6px;
}
md-dialog.bulk-edit-modal .border-bottom-none {
  border-bottom: none !important;
}
md-dialog.bulk-edit-modal .bulk-edit-warning {
  margin-top: 12px;
  padding: 8px 12px;
  background-color: #fffbf4;
  border-radius: 6px;
  font-size: 12px;
  color: #92480b;
  border: 1px solid #e1ae77;
}
md-dialog.bulk-edit-modal .contact-group-badge {
  display: inline-block;
  padding: 2px 6px;
  background-color: #e3f2fd;
  color: #1565c0;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 500;
}
md-dialog.bulk-edit-modal .contact-table-header {
  display: flex;
  background-color: rgba(0, 0, 0, 0.05);
  padding: 8px 16px;
  font-size: 12px;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.7);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
md-dialog.bulk-edit-modal .contact-table-row {
  display: flex;
  padding: 12px 16px;
  border-bottom: 1px solid #f0f0f0;
  align-items: center;
  min-height: 48px;
}
md-dialog.bulk-edit-modal .contact-col-name {
  flex: 2;
  min-width: 0;
}
md-dialog.bulk-edit-modal .contact-col-group {
  flex: 1.5;
  min-width: 0;
}
md-dialog.bulk-edit-modal .contact-col-email {
  flex: 2.5;
  min-width: 0;
}
md-dialog.bulk-edit-modal .contact-col-country-code {
  flex: 1;
  min-width: 0;
}
md-dialog.bulk-edit-modal .contact-col-phone-number {
  flex: 1.5;
  min-width: 0;
}
md-dialog.bulk-edit-modal .contact-col-action {
  flex: 0 0 80px;
  text-align: center;
}
md-dialog.bulk-edit-modal .contact-name {
  font-weight: 500;
  font-size: 13px;
  color: rgba(0, 0, 0, 0.87);
  word-wrap: break-word;
}
md-dialog.bulk-edit-modal .contact-info {
  font-size: 12px;
  color: rgba(0, 0, 0, 0.7);
  word-wrap: break-word;
}
md-dialog.bulk-edit-modal .contact-info-empty {
  font-size: 12px;
  color: rgba(0, 0, 0, 0.4);
}
md-dialog.bulk-edit-modal .contact-change {
  font-size: 12px;
  line-height: 1.4;
}
md-dialog.bulk-edit-modal .contact-old {
  color: rgba(0, 0, 0, 0.5);
  text-decoration: line-through;
}
md-dialog.bulk-edit-modal .contact-arrow {
  color: #ef6c00;
  margin: 0 4px;
  font-weight: 600;
}
md-dialog.bulk-edit-modal .contact-new {
  color: #ef6c00;
  font-weight: 500;
}
md-dialog.bulk-edit-modal .contact-action-badge {
  font-size: 10px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 4px;
  text-align: center;
  min-width: 60px;
}
md-dialog.bulk-edit-modal .contact-action-new {
  color: #2e7d32;
  background-color: #e8f5e9;
}
md-dialog.bulk-edit-modal .contact-action-update {
  color: #ef6c00;
  background-color: #fff3e0;
}
md-dialog.bulk-edit-modal .contact-action-remove {
  color: #c62828;
  background-color: #ffebee;
}

.schedule-timezone-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.timezone-warning {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 8px 7px 10px;
  background-color: #fff4d6;
  border: 1px solid #f0d68a;
  border-radius: 6px;
  white-space: nowrap;
  margin-top: 8px;
}
.timezone-warning__icon {
  flex-shrink: 0;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
}
.timezone-warning__text {
  font-size: 12px;
  font-weight: 600;
  color: #92480b;
}
.timezone-warning__action {
  flex-shrink: 0;
  margin: 0 !important;
}

.alert-templates dt-thing-details-labels .table-container--labels {
  border: none !important;
  box-shadow: none !important;
}
.alert-templates .alert-templates-table {
  border: none !important;
  box-shadow: none !important;
}
.alert-templates {
  /* Escalation tooltip styles */
}
.alert-templates .escalation-tooltip-container {
  position: relative;
}
.alert-templates .escalation-tooltip-container:hover .escalation-tooltip {
  display: block;
}
.alert-templates .escalation-tooltip {
  display: none;
  position: fixed;
  z-index: 10000;
  background: white;
  border-radius: 5px;
  box-shadow: 0 0 0 1px #e0e0e0, 0 15px 35px 0 rgba(49, 49, 93, 0.1), 0 5px 15px 0 rgba(0, 0, 0, 0.08);
  padding: 16px;
  min-width: 220px;
  max-width: 440px;
  opacity: 1;
  pointer-events: auto;
}
.alert-templates .escalation-tooltip .contact-group-chip {
  background-color: #f0f8ff;
  border-radius: 6px;
  font-weight: 600;
  margin: 0;
  border: 1px solid #8fbbeb;
}
.alert-templates .escalation-divider {
  width: 100%;
  height: 1px;
  background-color: #e0e0e0;
  margin: 8px 0 12px 0;
  opacity: 0.6;
}
.alert-templates .master-view {
  padding-bottom: 80px; /* Space for fixed bulk action bar */
}
.alert-templates {
  /* Ensure all containers allow tooltip to show */
}
.alert-templates .master-detail-container,
.alert-templates .master-view,
.alert-templates .alert-templates-table,
.alert-templates .table-container,
.alert-templates md-table-container {
  overflow: visible !important;
}
.alert-templates {
  /* Bulk edit selection */
}
.alert-templates .md-row-selected {
  background-color: #f0f7ff !important;
}
.alert-templates .select-all-banner {
  text-align: center;
  padding: 8px 12px;
  margin-bottom: 0;
  font-size: 13px;
  color: #495057;
}
.alert-templates .select-all-banner span {
  background-color: #f0f7ff;
  border: 1px solid #d0e3f7;
  border-radius: 4px;
  padding: 4px 12px;
  display: inline-block;
}
.alert-templates .select-all-banner a {
  color: #1a73e8;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.alert-templates .select-all-banner a:hover {
  text-decoration: underline;
}
.alert-templates .bulk-action-bar {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px 8px 16px;
  background: white;
  border-radius: 12px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);
  white-space: nowrap;
}
.alert-templates .bulk-action-bar__count {
  font-weight: 600;
  font-size: 13px;
  padding-right: 10px;
  border-right: 1px solid #e0e0e0;
  margin-right: 2px;
}
.alert-templates .validation-button {
  background-color: #f8f9fa !important;
  border: 1px solid #dee2e6 !important;
  color: #495057 !important;
}
.alert-templates .validation-button .icon-button__text {
  color: #495057 !important;
}
.alert-templates .validation-button md-icon path {
  fill: #495057 !important;
}
.alert-templates .validation-button:hover:not([disabled]) {
  background-color: #e9ecef !important;
  border-color: #adb5bd !important;
}
.alert-templates .validation-button:hover:not([disabled]) .icon-button__text {
  color: #343a40 !important;
}
.alert-templates .validation-button:hover:not([disabled]) md-icon path {
  fill: #343a40 !important;
}
.alert-templates .starter-template-card {
  cursor: pointer;
  border: 1px solid #d0d7de;
  border-radius: 8px;
  padding: 16px;
  max-width: 280px;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.alert-templates .starter-template-card:hover {
  border-color: #8fb1d1;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.location-modal .location-modal__content {
  padding: 0 !important;
  overflow: hidden;
}
.location-modal .location-modal__layout {
  display: flex;
  flex-direction: row;
  height: 65vh;
}
.location-modal .location-modal__map-section {
  flex: 0.7;
  position: relative;
  background-color: rgb(246, 241, 240);
}
.location-modal .location-modal__map-section #location-modal-map {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.location-modal .location-modal__map-section.pointer-crosshair,
.location-modal .location-modal__map-section .pointer-crosshair {
  cursor: crosshair;
}
.location-modal .location-modal__map-section .map-text-container {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
}
.location-modal .location-modal__map-section .map-text-container .map-text {
  background-color: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(2px);
  padding: 6px 12px;
  border-radius: 0 0 6px 0;
  font-size: 13px;
  font-weight: 600;
  margin: 0;
}
.location-modal .location-modal__map-section .confirm-dialog-container {
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
.location-modal .location-modal__map-section .confirm-dialog-container .buttons {
  display: flex;
  gap: 8px;
  background-color: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(4px);
  padding: 8px 12px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.location-modal .location-modal__project-list {
  flex: 0.3;
  min-width: 260px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid rgba(0, 0, 0, 0.08);
  background-color: #fff;
}
.location-modal .location-modal__project-list .project-list__header {
  font-weight: 600;
  padding: 16px 16px 12px 16px;
}
.location-modal .location-modal__project-list .dt-search-box {
  margin: 0 16px 0 16px;
}
.location-modal .location-modal__project-list .project-list__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  padding: 24px;
  text-align: center;
  font-size: 13px;
  opacity: 0.8;
}
.location-modal .location-modal__project-list .project-list__container {
  flex: 1;
  overflow-y: auto;
  padding: 8px 16px 16px 16px;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px 0;
  border: 1px solid transparent;
  cursor: pointer;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item:not(:first-child) {
  border-top: 1px solid rgba(218, 220, 232, 0.4);
}
.location-modal .location-modal__project-list .project-list__container .project-list__item.disabled {
  opacity: 0.6;
  pointer-events: none;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item:hover + .project-list__item, .location-modal .location-modal__project-list .project-list__container .project-list__item.active + .project-list__item {
  border-top: 1px solid transparent;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item:hover, .location-modal .location-modal__project-list .project-list__container .project-list__item.active {
  background-color: rgba(218, 220, 232, 0.25);
  border: 1px solid rgba(218, 220, 232, 0.6);
  border-radius: 6px;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item:hover .actions, .location-modal .location-modal__project-list .project-list__container .project-list__item.active .actions {
  display: flex;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item:hover .project-list__item-first-row-name, .location-modal .location-modal__project-list .project-list__container .project-list__item.active .project-list__item-first-row-name {
  font-weight: 600;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item.active {
  background-color: rgba(218, 220, 232, 0.1);
}
.location-modal .location-modal__project-list .project-list__container .project-list__item-first-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  padding-left: 8px;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item-first-row .location-indicator {
  margin-left: 4px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: rgba(165, 165, 165, 0.5);
  border: 1px solid rgba(165, 165, 165, 0.8);
}
.location-modal .location-modal__project-list .project-list__container .project-list__item-first-row .location-indicator.has-location {
  background-color: #58ADEA;
  border: 1px solid #438ec3;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item .actions {
  display: none;
  justify-content: start;
  gap: 4px;
  padding-left: 8px;
  margin-bottom: 2px;
}
.location-modal .location-modal__project-list .project-list__container .project-list__item .actions.active {
  display: flex;
  flex-direction: column;
}
.location-modal .mapboxgl-popup-content {
  padding: 16px 18px;
  border-radius: 8px;
  backdrop-filter: blur(2px);
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 0 1px rgba(10, 20, 40, 0.05), 0 2px 6px -4px rgba(20, 60, 100, 0.15), 0 8px 20px -12px rgba(45, 95, 150, 0.3);
}
.location-modal .mapboxgl-popup-content .popup-content {
  font-family: "Open Sans", sans-serif;
  min-width: 150px;
  font-size: 13px;
  line-height: 20px;
  display: flex;
  flex-direction: column;
}
.location-modal .mapboxgl-popup-content .popup-content .popup-title {
  font-weight: 600;
}

.escalation-builder--read-only {
  opacity: 0.7;
  pointer-events: none;
}
.escalation-builder--read-only .input-element,
.escalation-builder--read-only textarea,
.escalation-builder--read-only select,
.escalation-builder--read-only md-chips {
  background-color: #f5f5f5 !important;
  cursor: not-allowed;
}
.escalation-builder--read-only .dynamic-inputs .icon-button,
.escalation-builder--read-only .dynamic-input-container .icon-button {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
  box-shadow: none !important;
}

.sonner-container {
  position: fixed;
  bottom: 32px;
  right: 32px;
  z-index: 99999;
  width: 356px;
  pointer-events: none;
}

.sonner-toast {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid #e8e8e8;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  pointer-events: auto;
  transition: transform 400ms cubic-bezier(0.21, 1.02, 0.73, 1), opacity 400ms cubic-bezier(0.21, 1.02, 0.73, 1);
}
.sonner-toast--removing {
  opacity: 0 !important;
  transform: translateY(20px) scale(0.95) !important;
  transition: transform 300ms ease-in, opacity 300ms ease-in;
}
.sonner-toast__icon {
  flex-shrink: 0;
  margin-top: 1px;
  line-height: 0;
}
.sonner-toast__content {
  flex: 1;
  min-width: 0;
}
.sonner-toast__title {
  font-size: 13px;
  font-weight: 500;
  color: #1a1a1a;
  line-height: 1.4;
}
.sonner-toast__description {
  font-size: 12px;
  font-weight: 400;
  color: #71717a;
  line-height: 1.4;
  margin-top: 2px;
}
.sonner-toast__close {
  flex-shrink: 0;
  appearance: none;
  background: none;
  border: 1px solid #e8e8e8;
  border-radius: 4px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #a1a1aa;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  transition: background 150ms, color 150ms, border-color 150ms;
  opacity: 0;
}
.sonner-toast__close:hover {
  background: #f4f4f5;
  color: #52525b;
  border-color: #d4d4d8;
}
.sonner-toast:hover .sonner-toast__close {
  opacity: 1;
}

.sonner-container:hover .sonner-toast {
  transition: transform 400ms cubic-bezier(0.21, 1.02, 0.73, 1), opacity 200ms ease;
}

.new-user-flow {
  height: calc(100vh - 80px);
  width: 100vw;
}
.new-user-flow.animate-out {
  opacity: 0;
  transition: 0.3s opacity ease-in-out;
}
.new-user-flow .content-box {
  flex-grow: 0;
  padding: 0;
  width: 500px;
  transition: 0.25s all ease-out;
}
.new-user-flow .content-box .top-section {
  padding: 40px 60px 40px 60px;
}
@media (max-width: 735px) {
  .new-user-flow .content-box .top-section {
    padding: 32px;
  }
}
.new-user-flow .content-box .top-section {
  text-align: center;
}
.new-user-flow .content-box .top-section .header {
  margin-top: 0;
  margin-bottom: 6px;
  font-size: 18px;
  font-weight: 600;
}
.new-user-flow .content-box .top-section .description {
  margin: 0;
  font-size: 13px;
  opacity: 0.8;
}
.new-user-flow .content-box .top-section .steps {
  margin: 20px 20px 10px 20px;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.new-user-flow .content-box .top-section .steps .step {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-width: 32px;
  min-height: 32px;
  border-radius: 50%;
  background-color: white;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
  opacity: 0.6;
}
.new-user-flow .content-box .top-section .steps .step.active {
  color: #0e6248;
  background-color: #cbf4c7;
  box-shadow: 0px 0px 0px 1px rgba(14, 98, 72, 0.4), 0px 2px 4px -1px rgba(14, 98, 72, 0.2);
  opacity: 1;
}
.new-user-flow .content-box .top-section .steps .step.done {
  color: #0e6248;
  background-color: #cbf4c7;
  box-shadow: 0px 0px 0px 1px rgba(14, 98, 72, 0.4), 0px 2px 4px -1px rgba(14, 98, 72, 0.2);
  opacity: 1;
}
.new-user-flow .content-box .top-section .steps .step .step-number {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}
.new-user-flow .content-box .top-section .steps .step .step-text {
  position: absolute;
  color: #15394C;
  width: 120px;
  top: 28px;
  font-size: 12px;
  font-weight: 600;
}
.new-user-flow .content-box .top-section .steps .step-line {
  width: 100%;
  height: 1px;
  background-color: rgb(218, 220, 232);
  margin-top: 20px;
  margin-bottom: 20px;
}
.new-user-flow .content-box .separator {
  width: 100%;
  border-top: 1px solid rgb(218, 220, 232);
}
.new-user-flow .content-box .bottom-section {
  padding: 36px 56px;
}
@media (max-width: 735px) {
  .new-user-flow .content-box .bottom-section {
    padding: 32px;
  }
}
.new-user-flow .content-box .bottom-section.gray {
  background-color: rgb(246, 248, 250);
}
.new-user-flow .content-box .bottom-section .sub-header {
  opacity: 0.7;
  font-weight: 600;
  font-size: 13px;
  margin: 0;
}
.new-user-flow .content-box .bottom-section .header {
  font-weight: 600;
  font-size: 15px;
  margin: 0;
}
.new-user-flow .content-box .bottom-section .description {
  opacity: 0.8;
  margin-bottom: 0;
}
.new-user-flow .content-box .bottom-section .review-card {
  width: auto;
  padding: 24px 28px;
  border-radius: 8px;
  box-sizing: border-box;
  flex-grow: 1;
  background-color: #fff;
  border: 1px solid rgb(218, 220, 232);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}

md-input-container {
  font-size: 16px;
}
md-input-container.md-input-focused .md-input,
md-input-container.md-input-focused md-select .md-select-value {
  border-color: #207da9;
}
md-input-container .md-input,
md-input-container md-select .md-select-value {
  border-color: rgba(32, 125, 169, 0.38);
}
md-input-container .md-input[disabled].md-input--secret {
  background-image: none;
  border-color: rgba(0, 0, 0, 0.12);
  color: rgba(0, 0, 0, 0.87);
}
md-input-container.md-input-invalid .md-input-hint {
  bottom: -7px;
}
md-input-container.input-container--large {
  font-size: 24px;
}
md-input-container.input-container--large .md-input {
  font-size: 24px;
  height: 54px;
}
md-input-container label.md-required::after {
  display: inline-block;
  transform: translate(7px, 2px) scale(1.7);
  color: #cf252b !important;
  vertical-align: baseline !important;
}
md-input-container.md-input-invalid .md-input {
  border-color: rgba(207, 37, 43, 0.54) !important;
}
md-input-container.md-input-invalid.md-input-focused .md-input {
  border-color: #cf252b !important;
}
md-input-container.md-input-invalid label {
  color: #cf252b !important;
}
md-input-container.md-input-invalid .md-input-message-animation {
  color: #cf252b !important;
}

.input-container--short {
  width: 80px;
  margin-top: 0;
  margin-bottom: 0;
}
.input-container--short .md-errors-spacer {
  position: absolute;
}

.md-input-hint {
  position: relative;
  display: inline-block;
  left: 2px;
  right: auto;
  font-size: 11px;
  line-height: 1.25;
  transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
  color: rgb(90, 110, 140);
}

.icons {
  display: flex;
  box-sizing: border-box;
  position: relative;
  border-radius: 6px;
  background-color: rgb(246, 248, 252);
  border: solid 1px rgb(218, 220, 232);
  text-align: center;
}
.icons md-icon {
  height: 30px;
  width: 30px;
  min-height: 30px;
  min-width: 30px;
}
.icons path {
  fill: #15394C;
}

.icons--info {
  background-color: #e1e1e1;
}

.icons--warning {
  background-color: #fbbd14;
}
.icons--warning path {
  fill: #fff;
}

.icons--alert {
  background-color: #ec1c23;
}
.icons--alert path {
  fill: #fff;
}
.icons--alert .fa {
  color: #ec1c23;
}

.icons--transparent {
  background-color: transparent;
}

.icons--s md-icon {
  height: 16px;
  width: 16px;
  min-height: 16px;
  min-width: 16px;
}
.icons--s {
  width: 30px;
  height: 30px;
}

.icons--m md-icon {
  height: 24px;
  width: 24px;
  min-height: 24px;
  min-width: 24px;
}

.icons--l md-icon {
  height: 36px;
  width: 36px;
  min-height: 36px;
  min-width: 36px;
}

.icons--xl md-icon {
  height: 72px;
  width: 72px;
  min-height: 72px;
  min-width: 72px;
}
.icons--xl {
  padding: 10px;
}

.material-icons--xs {
  line-height: 13px;
  font-size: 13px;
  height: 13px;
  width: 13px;
  min-height: 13px;
  min-width: 13px;
}

.material-icons--s {
  line-height: 16px;
  font-size: 16px;
  height: 16px;
  width: 16px;
  min-height: 16px;
  min-width: 16px;
}

.material-icons--m {
  line-height: 20px;
  font-size: 20px;
  height: 20px;
  width: 20px;
  min-height: 20px;
  min-width: 20px;
}

.material-icons--l {
  line-height: 36px;
  font-size: 36px;
  height: 36px;
  width: 36px;
  min-height: 36px;
  min-width: 36px;
}

.material-icons--xl {
  line-height: 48px;
  font-size: 48px;
  height: 48px;
  width: 48px;
  min-height: 48px;
  min-width: 48px;
}

.material-icons--white path {
  fill: white;
}

.material-icons--text-color {
  color: #15394C;
}
.material-icons--text-color path {
  fill: #15394C;
}

.size--l {
  width: 36px;
  height: 36px;
}

.material-icons--primary {
  color: #207da9;
}

.material-icons--help {
  font-size: 20px;
  width: 20px;
  height: 20px;
  color: rgba(100, 189, 233, 0.6);
  cursor: default;
}

.icon-signal {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
}

.md-checkbox--icon .md-label {
  display: flex;
  flex-direction: row;
  align-content: center;
  align-items: center;
}

.icons--boost-mode {
  vertical-align: top;
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  fill: #fbbd14;
}

.icons.icons--m {
  width: 36px;
  height: 36px;
}

.icons.icons--muted {
  opacity: 0.4;
}

md-icon.alert-warning path {
  fill: #FF9615;
}

md-icon.alert-error path {
  fill: #cf252b;
}

.grey-blue-theme.fa, .grey-blue-theme.material-icons {
  color: rgba(0, 0, 0, 0.54) !important;
}

button,
select,
html,
textarea,
input {
  font-family: "Open Sans", sans-serif;
}

.form-element md-select .md-select-value .md-select-icon::after {
  font-size: 11px;
  /* stylelint-disable-next-line */
  font-family: "Material Icons";
}
.form-element .form-element-label {
  text-indent: 3px;
}
.form-element [disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}
.form-element.form-element--simple {
  margin: 0;
}
.form-element.form-element--simple md-select .md-select-value {
  font-size: 14px;
}
.form-element.form-element--simple .md-input {
  font-size: 14px;
}
.form-element.form-element--simple .md-errors-spacer {
  position: absolute;
}
.form-element.form-element--simple ~ .md-button--icon {
  margin-bottom: 0 !important;
}
.form-element.form-element--s {
  width: 40px;
}

.form-control-label {
  color: #000000;
  font-size: 14px;
  line-height: 30px;
}

.form-grid__group {
  margin-bottom: 24px;
  display: block;
}
.form-grid__group__label {
  font-family: "Open Sans", sans-serif;
  font-size: 11px;
  line-height: 1.36;
  text-transform: uppercase;
  font-weight: bold;
  color: rgb(90, 110, 140);
  margin: 8px 0;
}
.form-grid__row {
  margin-bottom: 16px;
  flex-direction: row;
  display: flex;
  align-content: start;
  max-width: 100%;
  align-items: center;
  justify-content: flex-start;
}
.form-grid__row--indent-xxl {
  margin-left: 72px;
}
.form-grid__row.is-unselected .label-text {
  opacity: 0.5;
}
.form-grid__row > md-input-container {
  margin: 0;
}
.form-grid__row > * {
  max-width: 100%;
  box-sizing: border-box;
}
.form-grid__row .form-grid__row {
  margin-bottom: 0;
}
.form-grid__row md-checkbox {
  margin-bottom: 0;
}
.form-grid__row md-checkbox dt-icon {
  margin-right: 12px;
}
.form-grid__row.gap24 > .form-grid__col {
  margin-left: 24px;
}
.form-grid__row.gap24 > .form-grid__col:first-child {
  margin-left: 0;
}
.form-grid__row.gap8 > .form-grid__col {
  margin-left: 8px;
}
.form-grid__row.gap8 > .form-grid__col:first-child {
  margin-left: 0;
}
.form-grid__row.gap16 > .form-grid__col {
  margin-left: 16px;
}
.form-grid__row.gap16 > .form-grid__col:first-child {
  margin-left: 0;
}
.form-grid__row.form-grid__row--static > .form-grid__col {
  width: auto;
}
.form-grid .form-grid__col {
  margin-left: 12px;
  width: 100%;
  display: block;
}
.form-grid .form-grid__col:first-child {
  margin-left: 0;
}
.form-grid .form-grid__col .md-caption {
  letter-spacing: normal;
}
.form-grid .form-grid__col__label {
  max-width: 70px;
}
.form-grid .form-grid__col__label--long {
  max-width: 130px;
}
.form-grid .form-grid__col6 {
  max-width: 100px;
}
.form-grid .form-grid__col8 {
  max-width: 44px;
}
.form-grid .form-grid__col12 {
  width: 24px;
}

.form-grid__label {
  font-size: 13px;
}

.form-group {
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
}
.form-group > .form-element {
  margin: 0;
  padding: 0;
  flex: 1;
}
.form-group > .form-element:not(.md-input-focused):not(.md-input-has-value) .form-element-label:not(.md-no-float):not(.md-container-ignore) {
  transform: translate3d(0, 26px, 0) scale(1);
}
.form-group > .md-button {
  margin: 0 0 24px 0;
  padding: 0;
  box-shadow: none !important;
  border-radius: 0;
  min-height: 30px;
  line-height: 30px;
  min-width: 30px;
  background-color: #707070;
}
.form-group > .md-button .material-icons {
  font-size: 14px;
  line-height: 24px;
}
.form-group.form-group--large > .form-element .md-input {
  height: 50px;
  line-height: 1.24;
}
.form-group.form-group--large > .form-element:not(.md-input-focused):not(.md-input-has-value) .form-element-label:not(.md-no-float):not(.md-container-ignore) {
  transform: translate3d(0, 36px, 0) scale(1);
}
.form-group.form-group--large > .md-button {
  min-height: 50px;
  line-height: 50px;
  min-width: 50px;
}
.form-group.form-group--large .material-icons {
  font-size: 18px;
}

.create-entity-form {
  background-color: #3e4a4f;
  margin: 0 0 10px 0;
  position: relative;
  padding: 16px;
  border-radius: 4px;
}
.create-entity-form md-content {
  background-color: transparent !important;
}

md-switch.md-default-theme.md-checked.md-primary[disabled] .md-bar,
md-switch.md-checked.md-primary[disabled] .md-bar {
  background: rgba(201, 205, 206, 0.7);
  cursor: not-allowed;
}

md-switch.md-default-theme.md-checked.md-primary[disabled] .md-thumb,
md-switch.md-checked.md-primary[disabled] .md-thumb {
  background: #c9cdce;
  cursor: not-allowed;
}

.hint {
  position: absolute;
  left: -12px;
  top: -30px;
  cursor: default;
  box-sizing: border-box;
  overflow: hidden;
  padding: 8px;
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  opacity: 0;
  z-index: -1;
}
.hint.is-visible {
  z-index: 105;
  opacity: 1;
  top: -54px;
  left: -12px;
}
.hint::after {
  content: "";
  text-indent: -9999px;
  display: block;
  overflow: hidden;
  position: absolute;
  border: 10px solid transparent;
  border-top-color: #303030;
  left: 24px;
  bottom: -11px;
}
.hint__content {
  background-color: #303030;
  color: rgb(250, 250, 250);
  max-height: 168px;
  max-width: 100%;
  min-height: 40px;
  padding: 4px;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  border-radius: 2px;
  font-size: 14px;
  overflow: hidden;
  -webkit-transform: translate3d(0, 0, 0) rotateZ(0deg);
  transform: translate3d(0, 0, 0) rotateZ(0deg);
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.hint__item {
  min-height: 40px;
  padding: 8px;
  border-radius: 2px;
  cursor: pointer;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.hint__item:hover {
  background-color: rgba(97, 97, 97, 0.5);
}
.hint__item.is-active {
  background-color: #616161;
}

.sidebar.content-box {
  width: 386px;
  flex-grow: 0;
  padding-top: 24px;
  position: relative;
}
.sidebar.content-box .content-box__toolbar {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 0;
}
.sidebar.content-box .content-box__toolbar > .md-button:last-of-type {
  margin-right: 0;
}
.sidebar.content-box .content-box__main {
  padding-top: 0;
}

.sidebar-right {
  width: 386px;
  position: relative;
}

dt-things-search-advanced {
  width: 386px;
}
dt-things-search-advanced > .box {
  width: 386px;
  box-sizing: border-box;
}

dt-as-thing-star md-icon {
  height: 20px;
  width: 20px;
  min-height: 20px;
  min-width: 20px;
  margin-right: 8px;
}
dt-as-thing-star .form-grid__label {
  line-height: 20px;
}

.push-out-box {
  background: #f0f2f3;
  margin: -16px -16px 12px -16px;
  padding: 4px 16px;
  box-sizing: border-box;
  border-bottom: 1px solid rgb(218, 220, 232);
}

.switch {
  position: relative;
  display: inline-block;
  width: 38px;
  height: 20px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.switch input:disabled + .slider.slider-green {
  opacity: 0.3;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgb(220, 220, 220);
  -webkit-transition: 0.4s;
  transition: 0.3s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 14px;
  width: 14px;
  left: 4px;
  bottom: 3px;
  background-color: white;
  -webkit-transition: 0.4s;
  transition: 0.3s;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 1px 0px, rgba(60, 66, 87, 0.16) 0px 0px 0px 1px;
}

input:checked + .slider {
  background-color: rgb(48, 144, 222);
}

input:checked + .slider.slider-green {
  background-color: #53bb51;
}

input:checked + .slider:before {
  -webkit-transform: translateX(16px);
  -ms-transform: translateX(16px);
  transform: translateX(16px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

.checkbox-round {
  position: relative;
}
.checkbox-round label {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 50%;
  cursor: pointer;
  height: 20px;
  left: 0;
  position: absolute;
  top: 0;
  width: 20px;
}
.checkbox-round label:after {
  border: 2px solid #fff;
  border-top: none;
  border-right: none;
  content: "";
  height: 4px;
  left: 5px;
  opacity: 0;
  position: absolute;
  top: 6px;
  transform: rotate(-45deg);
  width: 8px;
}
.checkbox-round input[type=checkbox] {
  visibility: hidden;
}
.checkbox-round input[type=checkbox]:checked + label {
  background-color: #3090de;
  border-color: #3090de;
}
.checkbox-round input[type=checkbox]:checked + label:after {
  opacity: 1;
}

.input-container .label {
  opacity: 0.65;
  margin-top: 0;
  padding-left: 1px;
  margin-bottom: 4px;
  font-size: 0.95em;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.input-container .label.required::after {
  content: " *";
  font-weight: 600;
  color: #b80000;
}
.input-container {
  position: relative;
  min-width: 72px;
}
@media (max-width: 735px) {
  .input-container.full-width-mobile {
    width: 100%;
    max-width: 100%;
    margin-bottom: 12px;
    margin-right: 0 !important;
  }
}
.input-container input {
  width: calc(100% - 16px) !important;
  cursor: text !important;
}
.input-container input::-webkit-outer-spin-button,
.input-container input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.input-container input::-webkit-input-placeholder {
  font-weight: 400;
}
.input-container input:-moz-placeholder {
  font-weight: 400;
}
.input-container input::-moz-placeholder {
  font-weight: 400;
}
.input-container input:-ms-input-placeholder {
  font-weight: 400;
}
.input-container textarea::-webkit-input-placeholder {
  font-weight: 400;
}
.input-container textarea:-moz-placeholder {
  font-weight: 400;
}
.input-container textarea::-moz-placeholder {
  font-weight: 400;
}
.input-container textarea:-ms-input-placeholder {
  font-weight: 400;
}
.input-container textarea {
  cursor: text !important;
}
.input-container {
  /* Firefox */
}
.input-container input[type=number] {
  -moz-appearance: textfield;
}
.input-container .input-element {
  position: relative;
  width: calc(100% - 14px);
  line-height: 32px;
  height: 32px;
  border-radius: 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: rgba(21, 57, 76, 0.95);
  background-color: white;
  font-weight: 600;
  border: 1px solid transparent;
  box-sizing: content-box;
  font-size: 14px;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 12px;
}
.input-container .input-element__icon-left {
  width: calc(100% - 33px);
  padding: 0 14px 0 32px;
}
.input-container .input-element {
  transition: 0.2s all;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 1px rgba(60, 66, 88, 0.14), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
}
.input-container .input-element[type=text] {
  box-shadow: 0px 1px 1px 0px rgba(60, 66, 88, 0.1), 0px 0px 0px 1px rgba(60, 66, 88, 0.14);
}
.input-container .input-element[type=text]:hover {
  box-shadow: 0px 1px 1px 0px rgba(60, 66, 88, 0.1), 0px 0px 0px 1px rgba(60, 66, 88, 0.14);
}
.input-container .input-element[type=text]:focus {
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 3px rgba(105, 180, 254, 0.5), 0px 0px 0px 1px rgba(60, 66, 88, 0.14), 0px 3px 6px 0px rgba(60, 66, 88, 0.12);
}
.input-container .input-element.left-segment {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-right: 1px;
  padding-bottom: 1px;
}
.input-container .input-element.right-segment {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  padding-bottom: 1px;
}
.input-container .input-element:hover:not(:disabled) {
  cursor: pointer;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 1px rgba(60, 66, 88, 0.18), 0px 3px 6px 0px rgba(60, 66, 88, 0.12);
}
.input-container .input-element:focus {
  outline: none;
}
.input-container .input-element:focus:not(.no-focus-highlight) {
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 3px rgba(105, 180, 254, 0.5), 0px 0px 0px 1px rgba(60, 66, 88, 0.14), 0px 3px 6px 0px rgba(60, 66, 88, 0.12);
}
.input-container .input-element.ng-invalid:not(.ng-untouched), .input-container .input-element.show-invalid.ng-empty {
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 2px rgba(254, 105, 105, 0.6), 0px 0px 0px 1px rgba(60, 66, 88, 0.18), 0px 3px 6px 0px rgba(60, 66, 88, 0.12);
}
.input-container .input-element:disabled {
  opacity: 0.7;
}
.input-container .input-icon {
  position: absolute;
  right: 6px;
  bottom: 8px;
  min-width: 18px;
  min-height: 18px;
  width: 18px;
  height: 18px;
  pointer-events: none;
}
.input-container .input-icon__start {
  left: 8px;
  right: auto;
}
.input-container .input-icon__start path {
  fill: #15394C;
}
.input-container .input-icon__end {
  right: -8px;
}
.input-container .input-icon.warning path {
  fill: #FF9615;
}
.input-container .input-icon.white path {
  fill: white;
}
.input-container .input-right-text {
  position: absolute;
  pointer-events: none;
  right: 10px;
  top: 30px;
  min-width: 18px;
  min-height: 18px;
  height: 18px;
  font-weight: 400;
  opacity: 0.5;
}
.input-container .input-right-text.warning {
  opacity: 0.9;
  color: #FF9615;
}
.input-container .input-hint {
  position: relative;
  display: inline-block;
  margin-top: 6px;
  left: 2px;
  right: auto;
  font-size: 12px;
  line-height: 1.25;
  color: rgb(90, 110, 140);
}
.input-container .input-hint.error {
  color: #cd3d64;
}
.input-container .input-dropdown {
  position: absolute;
  background-color: white;
  width: 100%;
  top: 64px;
}
.input-container .input-dropdown.no-label {
  top: 38px;
}
.input-container .input-dropdown {
  z-index: 2;
  border-radius: 6px;
  box-shadow: 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 1px 6px 10px -3px rgba(20, 60, 100, 0.16), 6px 26px 32px -16px rgba(70, 100, 130, 0.16);
}
.input-container .input-dropdown .item {
  padding: 8px 10px;
  margin: 7px;
  border-radius: 4px;
  transition: 0.2s all;
  cursor: pointer;
  outline: none;
}
.input-container .input-dropdown .item:hover {
  background-color: rgba(218, 220, 232, 0.4);
  opacity: 1;
}
.input-container .input-dropdown .item:hover .icon {
  color: rgba(21, 57, 76, 0.9);
}
.input-container .input-dropdown .item .icon {
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
  margin-right: 6px;
  margin-left: 0;
  color: rgba(21, 57, 76, 0.7);
}
.input-container .input-dropdown .item__no-animation {
  transition: none;
}
.input-container .input-dropdown .separator {
  width: 100%;
  height: 1px;
  background-color: rgba(218, 220, 232, 0.5);
}
.input-container .input-dropdown.time-range-picker {
  width: 140px;
  padding: 6px;
}
.input-container .input-dropdown.time-range-picker .item {
  font-size: 1.05em;
  margin: 0;
  padding: 5px 10px 5px 24px;
  position: relative;
}
.input-container .input-dropdown.time-range-picker .item.disabled {
  opacity: 0.5;
}
.input-container .input-dropdown.time-range-picker .item.disabled:hover {
  opacity: 1;
}
.input-container .input-dropdown.time-range-picker .item.disabled:hover span {
  display: none;
}
.input-container .input-dropdown.time-range-picker .item.disabled:hover::before {
  content: "Extend Storage";
  font-weight: 600;
}
.input-container .input-dropdown.time-range-picker .item.active::before {
  content: "";
  margin: 0;
  position: absolute;
  left: 9px;
  top: 13px;
  opacity: 0.8;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  opacity: 0.6;
  background-color: #15394C;
}

.dialog.dialog--map {
  width: 1024px;
  height: 768px;
}
.dialog.dialog--middle {
  width: 640px;
}

.dialog-overlay {
  position: absolute;
  z-index: 10;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.27);
}

.dialog-warning {
  width: 70%;
  left: 50%;
  top: 122px;
  position: absolute;
  margin-left: -35%;
}

.md-dialog-content p {
  font-size: 14px;
}

.block-header.block-header--accent .md-display-1 {
  font-size: 34px;
  font-weight: 400;
  line-height: 40px;
  color: #679FBA;
  margin: 0 0 8px 0;
}
.block-header.block-header--accent .md-body-1 {
  color: #679FBA;
  text-transform: uppercase;
  font-size: 14px;
  line-height: 1.24;
  margin: 8px 0;
}
.block-header.block-header--accent md-divider {
  padding: 0;
  margin: 8px 0;
  border-top-color: #679FBA;
}

.block-footer {
  border-top: 1px solid #859595;
  padding: 8px 8px 0;
  margin: 0 8px;
}
.block-footer__actions-bar {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.block-footer.block-footer--double-gap {
  margin: 0 16px;
}

.input-search {
  height: 20px;
  padding: 15px 15px 15px 40px;
  background-color: #fff;
  box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);
  position: relative;
}
.input-search .icons-processing {
  position: absolute;
  top: 50%;
  margin-top: -12px;
  left: 10px;
}
.input-search input[type=text] {
  background-color: #fff;
  padding: 0;
  margin: 0;
  font-size: 14px;
  line-height: 20px;
  height: 20px;
  width: 100%;
  border: none;
  display: block;
}
.input-search input[type=text]:focus {
  outline: none;
}
.input-search input[type=text]::-webkit-input-placeholder {
  color: #a9a9a9;
}
.input-search input[type=text]::-moz-placeholder {
  color: #a9a9a9;
}
.input-search input[type=text]:-moz-placeholder {
  color: #a9a9a9;
}
.input-search input[type=text]:-ms-input-placeholder {
  color: #a9a9a9;
}

.placeholder-block {
  margin: 0;
  padding: 8px;
  position: relative;
  pointer-events: none;
  box-sizing: border-box;
}
.placeholder-block > *:not(.placeholder-block__label) {
  opacity: 0.6;
}
.placeholder-block::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(150, 150, 150, 0.1) 35px, rgba(150, 150, 150, 0.1) 70px);
  width: 100%;
  height: 100%;
}
.placeholder-block--component::after {
  background-color: rgba(255, 255, 255, 0.6);
}
.placeholder-block__label {
  box-sizing: border-box;
  line-height: 1.24;
  padding: 8px 16px;
  background-color: #232d33;
  font-weight: normal;
  border-radius: 3px;
  color: #fff;
  position: absolute;
  top: 10px;
  left: 50%;
  width: 300px;
  margin-left: -150px;
  z-index: 10;
}
.placeholder-block__label h3 {
  font-family: "Open Sans", sans-serif;
}
.placeholder-block__image {
  max-width: 100%;
  width: 100%;
  height: auto;
}

.placeholder-component {
  position: relative;
  pointer-events: none;
}
.placeholder-component > * {
  opacity: 0.6;
}
.placeholder-component::after {
  content: "This functionality is not supported yet";
  display: block;
  line-height: 1.24;
  padding: 8px 16px;
  border-radius: 3px;
  background-color: #232d33;
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  font-weight: normal;
  color: #fff;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;
}

.disabled-block {
  position: relative;
  filter: grayscale(100%);
}
.disabled-block::before {
  display: block;
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.4);
  width: 100%;
  height: 100%;
}

.block-loader {
  display: flex;
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.6);
}
.block-loader > md-progress-circular {
  display: flex;
  margin: auto;
}

dt-message-box {
  display: block;
  position: relative;
}
dt-message-box .alert-box {
  display: flex;
  margin: 0;
}
dt-message-box .remove-button {
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
}
dt-message-box .remove-button md-icon {
  color: #15394C;
}
dt-message-box .remove-button {
  opacity: 0.65;
  transition: 0.3s ease opacity;
}
dt-message-box .remove-button:hover {
  opacity: 0.9;
}

.alert-box {
  padding: 24px;
  margin: 16px 0 16px;
  color: #15394C;
}
.alert-box--help, .alert-box--info {
  background-color: rgb(246, 248, 250);
  border: 1px solid rgba(218, 220, 232, 0.8);
}
.alert-box--help md-icon, .alert-box--info md-icon {
  color: rgba(32, 125, 169, 0.8);
}
.alert-box--system {
  border-radius: 6px;
  background-color: rgb(246, 248, 250);
  border: 1px solid rgba(218, 220, 232, 0.8);
}
.alert-box--in-progress {
  border-radius: 8px;
  margin: 16px !important;
  height: 80px !important;
  padding: 16px;
  background-color: rgba(235, 245, 255, 0.5490196078);
  border: 1px solid rgba(157, 195, 232, 0.8);
  box-shadow: 0 6px 12px -6px rgba(83, 129, 164, 0.231372549);
}
.alert-box--in-progress .alert-box__title {
  margin-bottom: 2px;
}
.alert-box--in-progress .alert-box__text {
  opacity: 0.8;
}
.alert-box--in-progress .remove-button {
  top: 28px;
  right: 28px;
}
.alert-box--failed-task {
  border-radius: 8px;
  margin: 16px !important;
  height: 80px !important;
  padding: 16px;
  background-color: rgba(255, 238, 235, 0.5490196078);
  border: 1px solid rgba(232, 184, 157, 0.8);
  box-shadow: 0 6px 12px -6px rgba(164, 108, 83, 0.231372549);
}
.alert-box--failed-task .alert-box__title {
  margin-bottom: 2px;
}
.alert-box--failed-task .alert-box__text {
  opacity: 0.8;
}
.alert-box--failed-task .alert-box__icon {
  padding: 0 10px;
}
.alert-box--failed-task .alert-box__icon md-icon {
  fill: rgba(214, 92, 40, 0.8);
  transform: scale(0.85);
}
.alert-box--failed-task .remove-button {
  top: 28px;
  right: 28px;
}
.alert-box--warning {
  border-radius: 0;
  border-bottom: 1px solid rgba(255, 150, 21, 0.5);
  background: linear-gradient(rgba(255, 150, 21, 0.08), rgba(255, 150, 21, 0.1));
}
.alert-box--warning .alert-box__title {
  margin-bottom: 2px;
}
.alert-box--warning .alert-box__text {
  font-size: 13px;
  margin-bottom: 0;
}
.alert-box--warning .icon-button {
  margin-left: 0;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(124, 61, 20, 0.16), 0px 2px 5px 0px rgba(179, 89, 27, 0.14);
  background-color: rgba(255, 255, 255, 0.9);
}
.alert-box--warning md-icon {
  color: #FF9615;
}
.alert-box--error {
  background-color: rgba(207, 37, 43, 0.2);
  border-bottom: 1px solid rgba(207, 37, 43, 0.2);
}
.alert-box--error md-icon {
  color: #cf252b;
}
.alert-box__title {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  color: #17384c;
  font-weight: bold;
  margin-bottom: 8px;
}
.alert-box__title--secondary {
  font-size: 12px;
  text-transform: uppercase;
  margin-top: 24px;
}
.alert-box__text {
  font-size: 14px;
  margin-bottom: 4px;
}
.alert-box__list {
  list-style: disc;
  padding-left: 10px;
  margin-left: 10px;
}
.alert-box__list-item {
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 4px;
}
.alert-box__icon {
  padding-left: 24px;
  padding-right: 24px;
  margin-right: 16px;
  display: flex;
}
@media (max-width: 735px) {
  .alert-box__icon {
    display: none;
  }
}
.alert-box__content {
  flex-grow: 1;
}
.alert-box__content md-checkbox {
  margin-top: 12px;
  margin-bottom: 0;
}
.alert-box__toggle {
  position: absolute;
  top: 15px;
  right: 15px;
}
.alert-box__toggle md-icon {
  color: #000000;
}

.alert-box-sections {
  display: flex;
  flex-direction: column;
}
@media (min-width: 736px) {
  .alert-box-sections {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
  .alert-box-sections__text {
    width: 70%;
  }
}
.alert-box-sections__button {
  text-align: right;
}
.alert-box-sections__button .md-button {
  color: #17384c !important;
}

.alert-box.contracted {
  margin: 8px 0 8px;
}
.alert-box.contracted .alert-box__title {
  margin-bottom: 0;
}
.alert-box.contracted .alert-box__icon {
  padding: 0;
}

.content-box {
  border-radius: 8px;
  box-sizing: border-box;
  flex-grow: 1;
  background-color: #fff;
  padding: 8px;
  border: 1px solid rgb(218, 220, 232);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}
@media (max-width: 735px) {
  .content-box {
    border-radius: 0;
    border-left: none;
    border-right: none;
    box-shadow: 1px 4px 8px -3px rgba(20, 60, 100, 0.1);
    padding: 16px;
  }
}
@media (min-width: 736px) {
  .content-box {
    padding: 20px;
  }
}
.content-box__header {
  background: #f0f2f3;
  margin: -16px -16px 0;
  padding: 16px 16px 0;
}
@media (min-width: 736px) {
  .content-box__header {
    margin: -12px -24px 0;
    padding: 12px 24px 0;
  }
}
.content-box__title, .md-dialog-title, .popover-preferences__title {
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  color: #324249;
  font-weight: 700;
  margin-bottom: 8px;
}
.content-box .local-time-container {
  display: inline-flex;
  background-color: rgba(240, 242, 243, 0.4117647059);
  border: 1px solid #e0e0e0;
  height: 28px;
  border-radius: 6px;
  padding: 0 6px;
  font-size: 0.9em;
  font-weight: 600;
  align-items: center;
}
.content-box .local-time-container md-icon {
  margin: 0;
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
}
.content-box .local-time-container .local-time {
  margin: 0 6px;
}
.content-box .local-time-container .local-time-description {
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  padding-left: 6px;
  height: 100%;
  align-content: center;
}
.content-box .information-container {
  background-color: rgb(246, 248, 250);
  border: 1px solid rgba(218, 220, 232, 0.8);
  padding: 18px 20px;
  border-radius: 5px;
  position: relative;
  transition: opacity 0.25s;
}
.content-box .information-container.ng-hide {
  opacity: 0;
}
@media (max-width: 735px) {
  .content-box .information-container {
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0;
  }
}
.content-box .information-container .info-content {
  flex-wrap: wrap;
}
@media (max-width: 735px) {
  .content-box .information-container .info-content {
    flex-direction: column;
    align-items: flex-start !important;
  }
}
.content-box .information-container .info-heading {
  margin-top: 0px;
  margin-bottom: 12px;
  font-size: 15px;
  font-weight: 600;
  color: #15394C;
}
.content-box .information-container md-table-container.table-container {
  background-color: transparent;
}
.content-box .information-container md-table-container.table-container th {
  background: transparent;
}
.content-box__footer {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 20px 0;
}
.content-box__footer.content-box__footer--bordered {
  border-top: solid 2px rgba(23, 56, 76, 0.4);
}
.content-box .info-item {
  min-width: 180px;
}
.content-box .info-item .item-icon {
  display: none;
  width: 42px;
  height: 42px;
  border-radius: 5px;
  margin-right: 12px;
  background-color: rgb(246, 248, 250);
  border: 1px solid rgba(218, 220, 232, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
}
.content-box .info-item .item-icon md-icon path {
  fill: #17384c;
}
.content-box .info-item .header {
  margin: 0;
  opacity: 0.8;
}
.content-box .info-item .value {
  margin: 0;
  font-weight: 600;
  font-size: 16px;
}

.state-block {
  background: rgb(239, 241, 245);
  display: flex;
  align-items: center;
  border-radius: 4px;
}
.state-block.no-top-radius {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.state-block.no-bottom-radius {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.state-block__pair {
  display: flex;
  flex-direction: column;
}
.state-block__label {
  text-transform: uppercase;
  font-size: 12px;
  color: #232d33;
  font-family: "Open Sans", sans-serif;
  font-weight: 400;
}
.state-block__value {
  font-family: "Open Sans", sans-serif;
  color: #15394C;
  font-weight: bold;
}
.state-block__value--main {
  font-size: 22px;
}
.state-block__value--error {
  color: #cf252b;
}
.state-block__icon {
  max-width: 16px;
  max-height: 20px;
  vertical-align: middle;
  margin-right: 8px;
}
.state-block .warning-container {
  border: 1px dashed rgba(255, 150, 21, 0.7);
  background-color: rgba(255, 150, 21, 0.06);
  padding: 12px 12px 12px 8px;
  border-radius: 6px;
  display: flex;
  flex-grow: 1;
  flex-direction: row;
}
.state-block .warning-container__boost {
  border: 1px dashed rgba(255, 150, 21, 0.7);
  background-color: rgba(255, 150, 21, 0.06);
}
.state-block .warning-container__boost .warning-icon {
  margin-left: 0;
  margin-right: 6px;
  margin-top: -2px;
}
.state-block .warning-container__boost .warning-icon path {
  fill: #FF9615;
}
.state-block .warning-container__offline {
  border: 1px dashed rgba(207, 37, 43, 0.3);
  background-color: rgba(207, 37, 43, 0.03);
}
.state-block .warning-container__offline .warning-icon {
  margin-left: 2px;
  margin-right: 6px;
  margin-top: 2px;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
}
.state-block .warning-container__offline .warning-icon path {
  fill: #cf252b;
}
.state-block .warning-container__auto-zero {
  border: 1px solid rgba(75, 158, 250, 0.6);
  background-color: rgba(248, 252, 255, 0.9);
}
.state-block .warning-container__auto-zero .warning-icon {
  margin-left: 2px;
  margin-right: 16px;
  margin-top: 2px;
  width: 60px !important;
  height: 60px !important;
  min-width: 60px !important;
  min-height: 60px !important;
}
.state-block .warning-container__deactivated {
  border: 1px solid rgba(160, 180, 190, 0.6);
  background-color: rgb(252, 252, 255);
}
.state-block .warning-container__deactivated .warning-icon {
  margin-left: 2px;
  margin-right: 6px;
  margin-top: 2px;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
}
.state-block .warning-container .header {
  margin-top: 0;
  margin-bottom: 2px;
}
.state-block .warning-container .description {
  opacity: 0.9;
  margin-top: 0;
  margin-bottom: 0;
}

.push-logs {
  margin-bottom: 16px;
}
.push-logs .push-logs__body {
  border: 1px solid #ddd;
  border-radius: 8px;
  min-height: 200px;
  overflow: hidden;
}
@media (max-width: 735px) {
  .push-logs .push-logs__body {
    flex-direction: column;
  }
}
.push-logs .push-logs__body .no-logs-message {
  padding: 16px;
  text-align: center;
  font-size: 14px;
  color: #6c757d;
  margin-top: 74.5px;
}
.push-logs .event-list {
  border-right: 1px solid #ddd;
  background-color: #fff;
  padding: 0;
  overflow-y: auto;
  flex: 1;
}
@media (max-width: 735px) {
  .push-logs .event-list {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #ddd;
    max-height: 150px;
  }
}
.push-logs .event-list .event-item {
  padding: 6px 16px;
  cursor: pointer;
  border-bottom: 1px solid #eee;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  flex-wrap: wrap;
}
.push-logs .event-list .event-item:last-child {
  border-bottom: none;
}
.push-logs .event-list .event-item:hover {
  background-color: #f8f9fa;
}
.push-logs .event-list .event-item.selected {
  background-color: #e9f2ff;
  border-left: 3px solid #007bff;
  padding-left: 13px;
}
.push-logs .event-list .event-item .event-item__header {
  display: flex;
  align-items: center;
  margin-bottom: 0;
  flex-grow: 1;
}
.push-logs .event-list .event-item .event-timestamp {
  font-size: 0.75em;
  color: #6c757d;
  min-width: 90px;
  text-align: right;
}
@media (max-width: 735px) {
  .push-logs .event-list .event-item .event-timestamp {
    width: 100%;
    text-align: left;
    margin-top: 4px;
  }
}
.push-logs .event-list .event-item .event-status {
  margin-right: 6px;
}
.push-logs .event-list .event-item .event-method {
  font-weight: 600;
  margin-right: 4px;
  font-size: 0.9em;
  min-width: 35px;
  color: #343a40;
}
.push-logs .event-list .event-item .event-endpoint {
  font-size: 0.9em;
  color: #495057;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-grow: 1;
}
.push-logs .event-details {
  padding: 20px;
  background-color: #fcfcfc;
  overflow-y: auto;
  flex: 1.5;
}
@media (max-width: 735px) {
  .push-logs .event-details {
    width: 100%;
  }
}
.push-logs .event-details .detail-item {
  margin-bottom: 12px;
  position: relative;
}
.push-logs .event-details .detail-item .detail-label {
  font-weight: 600;
  color: #17384c;
  margin-right: 8px;
}
.push-logs .event-details .detail-item .detail-value {
  color: #15394C;
}
.push-logs .event-details .detail-item .response-body {
  background-color: #f0f2f3;
  border: 1px solid #e0e0e0;
  padding: 15px;
  border-radius: 6px;
  white-space: pre-wrap;
  word-break: break-all;
  max-height: 350px;
  overflow-y: auto;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
  font-size: 0.9em;
}
.push-logs .event-details .detail-item .copy-response-button {
  position: absolute;
  top: 40px;
  right: 10px;
  z-index: 1;
}
.push-logs .response-body-container {
  position: relative;
}
.push-logs .no-response-body-message {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: grey;
  text-align: center;
}
.push-logs .paginator {
  flex-direction: row;
}

@media screen and (max-width: 399px) {
  .md-panel-container {
    left: 0 !important;
    right: 0 !important;
  }
  .md-panel-container::before {
    right: 20px;
  }
}
@media screen and (min-width: 400px) {
  .application-help-popup {
    max-width: 400px;
  }
}
.application-help-popup .md-button md-icon {
  transform: translateY(-2px);
  margin-right: 4px;
}
.application-help-popup a.md-button md-icon {
  vertical-align: middle;
}

md-autocomplete input::-webkit-input-placeholder {
  color: rgba(105, 120, 120, 0.75);
}
md-autocomplete input::-moz-placeholder {
  color: rgba(105, 120, 120, 0.75);
}
md-autocomplete input:-moz-placeholder {
  color: rgba(105, 120, 120, 0.75);
}
md-autocomplete input:-ms-input-placeholder {
  color: rgba(105, 120, 120, 0.75);
}

.context-help {
  position: relative;
  display: flex;
}
.context-help__close-btn {
  position: absolute;
  right: 0;
  top: 0;
}
.context-help__close-btn md-icon {
  color: #000000;
}
.context-help__icon {
  padding: 24px 40px 24px 24px;
  display: flex;
}
.master-view--with-detail .context-help__icon {
  display: none;
}
@media (max-width: 735px) {
  .context-help__icon {
    display: none;
  }
}
.context-help__body {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}
.master-view--with-detail .context-help__body {
  flex-direction: column;
}
@media (max-width: 735px) {
  .context-help__body {
    flex-direction: column;
  }
}
.context-help__text {
  font-size: 12px;
  line-height: 1.75;
}
.context-help__summary {
  flex-grow: 1;
  width: 100%;
}
.context-help__actions {
  width: 100%;
  flex-grow: 2;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.context-help__actions .md-button {
  min-width: 0;
  margin: 0;
  color: #17384c !important;
}
.context-help__actions .md-button md-icon {
  color: #17384c !important;
}

dt-copyable-input {
  display: block;
}

.copyable-value {
  font-family: "Menlo", "monospace", "Open Sans";
  box-shadow: rgba(60, 66, 87, 0.16) 0px 0px 0px 1px;
  border-radius: 4px;
  font-size: 12px;
  background-color: rgba(21, 57, 76, 0.05);
  padding: 5px 10px;
  margin: 0 5px 0 0;
  color: #15394C;
  display: inline-block;
}
.copyable-value.inline {
  padding: 2px 6px;
  margin: 2px;
}

.copy-icon-button {
  height: 26px !important;
  min-height: 26px !important;
  line-height: 24px !important;
  min-width: max-content;
  margin: 0 !important;
  border-radius: 4px !important;
}
.copy-icon-button .copy-icon {
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 18px;
}
.copy-icon-button .copy-text {
  font-size: 12px;
}

.dt-copyable-field--accent .copyable-value {
  color: #cf252b;
}

.information-container dt-copyable-input:not(.disabled-bg) .copyable-value {
  background-color: white;
}

.icon-button {
  height: 34px;
  min-height: 34px;
  line-height: 34px;
  background-color: white;
  border-radius: 5px;
  font-family: "Open Sans", sans-serif;
  color: #17384c;
  font-weight: 600;
  text-transform: none;
  transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  margin: 0 0 0 8px;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
}
.icon-button.small {
  height: 30px !important;
  min-height: 30px !important;
  line-height: 30px !important;
  min-width: fit-content;
}
.icon-button.extra-small {
  height: 26px !important;
  min-height: 26px !important;
  line-height: 26px !important;
  min-width: fit-content;
}
.icon-button.tiny-small {
  height: 22px !important;
  min-height: 22px !important;
  line-height: 22px !important;
  min-width: fit-content;
}
.icon-button.dark {
  background-color: #3e4a4f;
  box-shadow: 0 0 0 1px rgba(62, 74, 79, 0.8);
}
.icon-button.dark .icon-button__text {
  color: white;
}
.icon-button.serious-action {
  background-color: #dc3b3b;
  box-shadow: none;
}
.icon-button.serious-action .icon-button__text {
  color: white;
}
.icon-button.serious-action md-icon path {
  fill: white;
}
.icon-button.serious-action:hover {
  background-color: #c72b2b;
}
.icon-button.no-border-right {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.icon-button.no-border-left {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: -2px;
}
.icon-button.simple[disabled] {
  box-shadow: none;
  background-color: rgb(242, 244, 248);
}
.icon-button[disabled] {
  transition: none;
  opacity: 0.65;
}
.icon-button[disabled] md-icon path {
  fill: #737678;
}
.icon-button--active {
  background-color: aliceblue;
  border: 1px solid rgba(32, 125, 169, 0.3);
  box-shadow: none;
}
.icon-button .text-color-icon path {
  fill: #15394C;
}
.icon-button .green-icon path {
  fill: #6db966;
}
.icon-button md-icon path {
  transform: translateY(-2px);
  fill: #679FBA;
  transition: fill 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.icon-button__text {
  margin-left: 4px;
  margin-right: 4px;
  font-weight: 600;
  color: #17384c;
}
.icon-button__small-icon {
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
}
.icon-button__extra-small-icon {
  width: 15px;
  height: 15px;
  min-width: 15px;
  min-height: 15px;
}
.icon-button:hover:not([disabled]):not(.serious-action) {
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0 3px 9px 1px rgba(60, 66, 88, 0.08), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
}
.icon-button:hover:not([disabled]):not(.serious-action):not(.dark) {
  background-color: #fff;
}
.icon-button:hover:not([disabled]):not(.serious-action).dark {
  background-color: rgba(62, 74, 79, 0.9);
  box-shadow: 0 0 0 1px rgba(62, 74, 79, 0.6);
}
.icon-button md-progress-circular {
  display: inline-block;
  vertical-align: middle;
  margin-left: 3px;
  margin-right: 7px;
}
.icon-button md-progress-circular path {
  stroke: #15394C;
}
.icon-button_ready-animation {
  animation-name: ready-animation;
  animation-duration: 2s;
  animation-timing-function: ease-out;
  animation-iteration-count: infinite;
}
@keyframes ready-animation {
  0% {
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08), 0px 0px 0px -2px rgba(75, 158, 252, 0.6);
  }
  100% {
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08), 0px 0px 0px 10px rgba(75, 158, 252, 0);
  }
}
.icon-button.fade-animation {
  transition: opacity 0.25s;
}
.icon-button.fade-animation.ng-hide {
  opacity: 0;
}

.text-color-icon path {
  fill: #15394C;
}

dt-paginator {
  display: block;
}

.paginator {
  display: flex;
  flex-direction: column-reverse;
  justify-content: space-between;
  margin-top: 24px;
}
@media (min-width: 736px) {
  .master-view:not(.master-view--with-detail) .paginator {
    flex-direction: row;
    padding-left: 12px;
  }
}
.paginator__buttons {
  display: flex;
}
.paginator__spacer {
  flex-grow: 1;
}
.paginator__prev, .paginator__next {
  margin: 0 0 0 0;
}
@media (min-width: 736px) {
  .master-view:not(.master-view--with-detail) .paginator__prev, .master-view:not(.master-view--with-detail) .paginator__next {
    margin: 0 8px;
  }
}

.per-page-selector {
  font-size: 13px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.per-page-selector .hide {
  display: none;
}
.per-page-selector__label {
  margin-right: 8px;
}
.per-page-selector__item-container {
  display: inline-flex;
  border-radius: 2px;
  background-color: #eff1f5;
  padding: 3px;
  border-radius: 5px;
  box-shadow: 0 0 1px 0 rgb(218, 220, 232);
}
.per-page-selector__item {
  cursor: pointer;
  padding: 2px 10px;
  color: #15394C;
  opacity: 0.7;
  border-radius: 4px;
  font-size: 13px;
  font-weight: bold;
  outline: none;
}
.per-page-selector__item:hover {
  opacity: 1;
}
.per-page-selector__item.per-page-selector__item--active {
  background-color: white;
  color: #15394C;
  opacity: 1;
  box-shadow: 0 0 1px 0 rgba(20, 40, 60, 0.2), 0 1px 4px -1px rgba(20, 40, 60, 0.2);
}

md-dialog-actions dt-paginator {
  display: flex;
  border-top: none;
}
md-dialog-actions dt-paginator .paginator {
  margin-top: 0px;
  flex-direction: row;
}
md-dialog-actions dt-paginator .paginator .per-page-selector {
  display: none;
}
@media (min-width: 736px) {
  md-dialog-actions dt-paginator .paginator .per-page-selector {
    display: flex;
  }
}

.radio-status.radio-status--ccon {
  width: auto;
  align-items: center;
  justify-content: space-between;
}
.radio-status.radio-status--ccon .radio-status__bar {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: rgba(90, 110, 140, 0.5);
}
.radio-status.radio-status--ccon.radio-status--active-1 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--ccon.radio-status--active-2 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--ccon.radio-status--active-2 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--ccon.radio-status--active-3 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--ccon.radio-status--active-3 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--ccon.radio-status--active-3 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--ccon.radio-status--active-4 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--ccon.radio-status--active-4 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--ccon.radio-status--active-4 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--ccon.radio-status--active-4 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}

dt-radio-status-ccon {
  display: inline-block;
  width: 32px;
}
dt-radio-status-ccon.radio-status--wide {
  width: 64px;
}
dt-radio-status-ccon.radio-status--wide .radio-status__bar {
  border: 1px solid #17384c;
}

dt-radio-status {
  display: inline-block;
}

.radio-status {
  position: relative;
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}
.radio-status.radio-status--active-1 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--active-2 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--active-2 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--active-3 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--active-3 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--active-3 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--active-4 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--active-4 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--active-4 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--active-4 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}
.radio-status.radio-status--active-5 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--active-5 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--active-5 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--active-5 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}
.radio-status.radio-status--active-5 .radio-status__bar:nth-child(5) {
  background-color: #17384c;
}
.radio-status--boost.radio-status--active-1 .radio-status__bar:nth-child(1) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-2 .radio-status__bar:nth-child(1) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-2 .radio-status__bar:nth-child(2) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-3 .radio-status__bar:nth-child(1) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-3 .radio-status__bar:nth-child(2) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-3 .radio-status__bar:nth-child(3) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-4 .radio-status__bar:nth-child(1) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-4 .radio-status__bar:nth-child(2) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-4 .radio-status__bar:nth-child(3) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-4 .radio-status__bar:nth-child(4) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-5 .radio-status__bar:nth-child(1) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-5 .radio-status__bar:nth-child(2) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-5 .radio-status__bar:nth-child(3) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-5 .radio-status__bar:nth-child(4) {
  background-color: #FF9615;
}
.radio-status--boost.radio-status--active-5 .radio-status__bar:nth-child(5) {
  background-color: #FF9615;
}
.radio-status__bar {
  width: 5px;
  margin-left: 1px;
  border-radius: 2px;
  background-color: rgba(116, 147, 162, 0.5);
}
.radio-status__bar:nth-child(1) {
  height: 6px;
}
.radio-status__bar:nth-child(2) {
  height: 10px;
}
.radio-status__bar:nth-child(3) {
  height: 14px;
}
.radio-status__bar:nth-child(4) {
  height: 20px;
}
.radio-status__bar:nth-child(5) {
  height: 25px;
}
.radio-status .radio-status__icon {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
}
.radio-status.radio-status--boost .radio-status__icon--boost {
  display: block;
}
.radio-status.radio-status--offline .radio-status__icon--boost {
  display: none;
}
.radio-status.radio-status--offline .radio-status__icon--offline {
  display: block;
  fill: #ed1c24;
}

.radio-status.radio-status--wide {
  width: 64px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(1) {
  height: 7px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(2) {
  height: 9px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(3) {
  height: 11px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(4) {
  height: 13px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(5) {
  height: 15px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(6) {
  height: 17px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(7) {
  height: 19px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(8) {
  height: 21px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(9) {
  height: 23px;
}
.radio-status.radio-status--wide .radio-status__bar:nth-child(10) {
  height: 25px;
}
.radio-status.radio-status--wide.radio-status--active-1 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-2 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-2 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-3 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-3 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-3 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-4 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-4 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-4 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-4 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-5 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-5 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-5 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-5 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-5 .radio-status__bar:nth-child(5) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-6 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-6 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-6 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-6 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-6 .radio-status__bar:nth-child(5) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-6 .radio-status__bar:nth-child(6) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-7 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-7 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-7 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-7 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-7 .radio-status__bar:nth-child(5) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-7 .radio-status__bar:nth-child(6) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-7 .radio-status__bar:nth-child(7) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-8 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-8 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-8 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-8 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-8 .radio-status__bar:nth-child(5) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-8 .radio-status__bar:nth-child(6) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-8 .radio-status__bar:nth-child(7) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-8 .radio-status__bar:nth-child(8) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-9 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-9 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-9 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-9 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-9 .radio-status__bar:nth-child(5) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-9 .radio-status__bar:nth-child(6) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-9 .radio-status__bar:nth-child(7) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-9 .radio-status__bar:nth-child(8) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-9 .radio-status__bar:nth-child(9) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(1) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(2) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(3) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(4) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(5) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(6) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(7) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(8) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(9) {
  background-color: #17384c;
}
.radio-status.radio-status--wide.radio-status--active-10 .radio-status__bar:nth-child(10) {
  background-color: #17384c;
}

.dt-layout {
  height: 100%;
}

@media (max-width: 735px) {
  .with-header {
    padding-top: 60px;
  }
}
@media (min-width: 736px) and (max-width: 959px) {
  .with-header {
    padding-top: 60px;
  }
}

.dt-layout-header {
  display: block;
  height: 60px;
  padding: 5px 0;
  box-sizing: border-box;
  background-color: rgba(239, 241, 245, 0.9);
  backdrop-filter: blur(1px);
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  will-change: transform;
  border-bottom: 1px solid rgb(218, 220, 232);
  z-index: 5;
  display: none;
}
.dt-layout-header md-toolbar {
  min-height: 50px;
}
.dt-layout-header md-toolbar md-icon {
  fill: rgba(21, 57, 76, 0.85);
  color: rgba(21, 57, 76, 0.85);
}
.dt-layout-header .md-toolbar-tools {
  height: 50px;
  max-height: 50px;
}
@media (max-width: 735px) {
  .dt-layout-header {
    display: block;
  }
}
@media (min-width: 736px) and (max-width: 959px) {
  .dt-layout-header {
    display: block;
  }
}
.dt-layout-header .mobile-menu md-icon path {
  fill: rgba(255, 255, 255, 0.87);
}
.dt-layout-header__tools .md-button {
  padding: 0;
  color: #fff;
  min-width: 0;
  margin: 0 0 -4px 16px;
  transition: none;
  opacity: 0.8;
}
.dt-layout-header__tools .md-button:hover {
  opacity: 1;
  background: transparent;
}
.dt-layout-header__tools .md-button md-icon {
  font-size: 24px;
  line-height: 1;
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  margin-bottom: 4px;
}
.dt-layout-header__tools .md-button md-icon svg,
.dt-layout-header__tools .md-button md-icon g,
.dt-layout-header__tools .md-button md-icon path {
  fill: #fff;
}
.dt-layout-header__tools .md-button span {
  font-family: "Open Sans", sans-serif;
  font-size: 11px;
  line-height: 1.5;
  text-transform: uppercase;
  font-weight: 400;
  -webkit-font-smoothing: auto;
  letter-spacing: normal;
}
.dt-layout-header__tools .md-button--current {
  opacity: 1;
  color: #679FBA;
}
.dt-layout-header__tools .md-button--current md-icon svg,
.dt-layout-header__tools .md-button--current md-icon g,
.dt-layout-header__tools .md-button--current md-icon path {
  fill: #679FBA;
}
.dt-layout-header__tools .md-icon-button:not(.notification-fab):hover {
  background-color: rgba(158, 158, 158, 0.2);
}
.dt-layout-header__tools .notification-fab {
  background-color: #ed1c24;
  position: relative;
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  line-height: 34px;
  overflow: visible;
}
.dt-layout-header__tools .notification-fab .material-icons {
  font-size: 20px;
  line-height: 1;
  width: 20px;
  min-width: 20px;
  height: 20px;
  min-height: 20px;
}
.dt-layout-header__tools--mobile {
  background: #232d33;
}
.dt-layout-header__header-item {
  margin-left: 12px;
  position: relative;
}
.dt-layout-header__header-item:hover {
  opacity: 0.8;
}
.dt-layout-header__header-item.new-features::before {
  position: absolute;
  content: "";
  height: 7px;
  width: 7px;
  border-radius: 50%;
  top: 9px;
  right: -5px;
  background-color: rgba(255, 83, 49, 0.9);
  animation: pulse-orange 2.5s infinite;
}
@keyframes pulse-orange {
  0% {
    transform: scale(0.9) translateX(-2px) translateY(1px);
    box-shadow: 0 0 0 0 rgba(255, 83, 49, 0.7);
  }
  40% {
    transform: scale(1) translateX(0) translateY(0);
    box-shadow: 0 0 0 7px rgba(255, 83, 49, 0);
  }
  100% {
    transform: scale(0.9) translateX(-2px) translateY(1px);
    box-shadow: 0 0 0 0 rgba(255, 83, 49, 0);
  }
}
.dt-layout-header__header-item .material-icons {
  line-height: 32px;
  font-size: 32px;
  height: 32px;
  width: 32px;
  min-height: 32px;
  min-width: 32px;
}
.dt-layout-header__header-item .material-icons path {
  fill: rgb(255, 255, 255);
}
.dt-layout-header__header-item .material-icons .header-text {
  color: white;
  font-size: 13px;
  vertical-align: middle;
}
@media (min-width: 736px) and (max-width: 959px) {
  .dt-layout-header__header-item {
    margin-left: 10px;
  }
}
.dt-layout-header .md-toolbar-tools > .md-button:first-child {
  min-width: 40px;
  margin-right: 0;
}

.md-open-menu-container {
  z-index: 105;
}

.projects-bar {
  margin-left: 4px;
  height: 40px;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: left;
  color: #15394C;
  cursor: pointer;
}
.projects-bar__dropdown {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  border-radius: 6px;
  border: 1px solid #dadce8;
  box-shadow: 0 1px 4px -2px rgba(20, 40, 60, 0.2);
  background-color: white;
  transition: all 0.2s ease-in-out;
}
.projects-bar__dropdown:focus {
  outline: none;
  border: 0;
}
.projects-bar .organization-section {
  margin-left: 0;
  margin-right: 0;
  padding-right: 12px;
  padding-left: 12px;
  border-right: 1px solid rgba(218, 220, 232, 0.2);
  height: 100%;
}
.projects-bar .project-section {
  margin-left: 0;
  margin-right: 0;
  padding-left: 12px;
  display: flex;
  justify-content: space-around;
  height: 100%;
}
@media (max-width: 735px) {
  .projects-bar .md-button {
    min-width: 0;
    padding-left: 8px;
    padding-right: 8px;
  }
}
.projects-bar .bar-text {
  margin: 6px;
  margin-left: 0px;
  opacity: 1;
  cursor: pointer;
  font-size: 14px;
  line-height: normal;
  font-weight: 400;
  text-transform: none;
  transition: 0.3s opacity ease-in-out;
}
.projects-bar .bar-text.organization {
  font-size: 14px;
  opacity: 0.7;
}
.projects-bar .bar-text.project {
  font-size: 14px;
  font-weight: 600;
  opacity: 0.9;
}
@media (max-width: 735px) {
  .projects-bar .bar-text.project {
    padding-left: 6px;
  }
}
.projects-bar .bar-text.highlighted {
  opacity: 1;
}

md-menu-item > .md-button.dt-header-link {
  opacity: 0.8;
  color: #fff;
  text-transform: uppercase;
}
md-menu-item > .md-button.dt-header-link md-icon svg,
md-menu-item > .md-button.dt-header-link md-icon g,
md-menu-item > .md-button.dt-header-link md-icon path {
  fill: #fff;
}
md-menu-item > .md-button.dt-header-link--current {
  opacity: 1;
  color: #679FBA;
}
md-menu-item > .md-button.dt-header-link--current md-icon svg,
md-menu-item > .md-button.dt-header-link--current md-icon g,
md-menu-item > .md-button.dt-header-link--current md-icon path {
  fill: #679FBA;
}

dt-search-box, .dt-search-box {
  display: block;
  box-sizing: border-box;
  border-radius: 6px;
  border: 1px solid rgb(218, 220, 232);
  position: relative;
  height: 40px;
  background-color: #fff;
  box-shadow: 0 1px 4px -2px rgba(20, 40, 60, 0.2);
  transition: all 0.2s ease-out;
}
dt-search-box:hover, .dt-search-box:hover {
  box-shadow: 0 2px 6px -3px rgba(20, 40, 60, 0.25);
  border: 1px solid rgb(218, 220, 232);
}
dt-search-box.height-36, .dt-search-box.height-36 {
  height: 36px;
}
dt-search-box.height-36 .dtSearch-box__input, .dt-search-box.height-36 .dtSearch-box__input {
  line-height: 28px;
  height: 28px;
  font-size: 15px;
}
dt-search-box.height-36 .dtSearch-box__search-btn, .dt-search-box.height-36 .dtSearch-box__search-btn {
  height: 36px;
}

.dtSearch-box__tools {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  height: inherit;
  padding: 0 0 0 44px;
}

.dtSearch-box__search-btn {
  position: absolute;
  top: 0;
  left: 0;
}
.dtSearch-box__search-btn .material-icons {
  color: rgba(32, 125, 169, 0.3) !important;
}
.dtSearch-box__input {
  display: block;
  flex-grow: 1;
  box-sizing: border-box;
  background-color: transparent;
  margin: 0;
  font-size: 16px;
  line-height: 32px;
  height: 32px;
  border: none;
  -webkit-appearance: none !important;
}
.dtSearch-box__input::-webkit-input-placeholder {
  color: rgba(105, 120, 120, 0.75);
}
.dtSearch-box__input::-moz-placeholder {
  color: rgba(105, 120, 120, 0.75);
}
.dtSearch-box__input:focus {
  outline: none;
}
.dtSearch-box__input:-moz-placeholder {
  color: rgba(105, 120, 120, 0.75);
}
.dtSearch-box__input:-ms-input-placeholder {
  color: rgba(105, 120, 120, 0.75);
}
.dtSearch-box__controls {
  white-space: nowrap;
}
.dtSearch-box__controls > .md-button {
  margin-left: 0;
  margin-right: -16px;
}
.dtSearch-box__controls > .md-button .material-icons {
  color: #b1b1b1;
  transition: color 0.1s ease-out;
}
.dtSearch-box__controls > .md-button .material-icons:hover {
  color: #757575;
}
.dtSearch-box__controls > .md-button:last-of-type {
  margin-right: -4px;
}
.dtSearch-box__dropdown {
  position: absolute;
  top: calc(100% + 6px);
  max-height: 70vh;
  overflow: scroll;
  max-width: 280px;
  padding: 8px 0;
  left: 0;
  right: 0;
  z-index: 30;
  background-color: #fff;
  border-radius: 6px;
  box-shadow: 0 0 0 1px rgba(136, 152, 170, 0.2), 0 15px 35px 0 rgba(49, 49, 93, 0.1), 0 5px 15px 0 rgba(0, 0, 0, 0.08);
  transition: all ease 0.25s;
}
.dtSearch-box__dropdown.ng-hide {
  transform: translateY(-4px);
  opacity: 0;
}
.dtSearch-box__dropdown .selection-area {
  position: absolute;
  z-index: 1;
  background-color: rgba(103, 159, 186, 0.05);
  box-shadow: 0 0 0 1px rgba(103, 159, 186, 0.25);
  margin: 0 8px;
  border-radius: 6px;
  width: calc(100% - 16px);
  transition: all 0.2s ease;
}
.dtSearch-box__dropdown .item-container {
  position: relative;
  z-index: 2;
}
.dtSearch-box__dropdown .item-container .item-main {
  display: flex;
  align-items: center;
  padding: 6px 12px 6px 8px;
  margin: 0 8px;
  border-radius: 6px;
  cursor: pointer !important;
}
.dtSearch-box__dropdown .item-container .item-main:hover .chevron {
  transition: 0.3s all ease;
  border-radius: 4px;
  background-color: white;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
}
.dtSearch-box__dropdown .item-container .item-main .section-text {
  font-weight: 600;
}
.dtSearch-box__dropdown .item-container .item-main .chevron {
  outline: none;
}
.dtSearch-box__dropdown .item-container .item-main .chevron md-icon {
  transition: 0.2s all ease;
  transform: rotate(90deg);
  opacity: 0.5;
}
.dtSearch-box__dropdown .item-container .item-main .chevron.expanded md-icon {
  transform: rotate(90deg) scaleX(-1);
}
.dtSearch-box__dropdown .item-container .item-main .chevron:hover md-icon {
  opacity: 0.75;
}
.dtSearch-box__dropdown .item-container .sub-item {
  outline: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin: 0 8px;
  padding: 11px 12px 11px 21px;
  cursor: pointer !important;
}
.dtSearch-box__dropdown .item-container .sub-item .active-indicator {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 24px;
  background-color: rgba(32, 125, 169, 0);
  box-shadow: 0px 0px 0px 1px rgba(21, 57, 76, 0.2);
  transition: all 0.2s ease;
}
.dtSearch-box__dropdown .item-container .sub-item .active-indicator.active {
  background-color: rgba(21, 57, 76, 0.6);
  box-shadow: 0px 0px 0px 1px rgba(21, 57, 76, 0.6);
}
.dtSearch-box__dropdown .item-container .sub-item .name {
  opacity: 0.6;
  transition: all 0.2s ease;
  font-weight: 600;
}
.dtSearch-box__dropdown .item-container .sub-item .name.active {
  opacity: 1;
}
.dtSearch-box__dropdown .separator {
  height: 1px;
  width: 100%;
  margin-top: 12px;
  margin-bottom: 12px;
  background-color: rgba(218, 220, 232, 0.5);
}

.things-toolbox__controls {
  margin-left: auto;
  padding-left: 16px;
}
.things-toolbox__controls .md-button {
  margin-left: 0;
  margin-right: 0;
}
.things-toolbox__controls .md-menu .md-button .material-icons {
  transform: translateY(-2px);
}

dt-splash-screen {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  background-color: rgb(239, 241, 245);
}

@keyframes text-scale {
  0% {
    transform: scale(1);
  }
  30% {
    color: #f89631;
  }
  50% {
    transform: scale(1.2);
  }
  70% {
    color: #f89631;
  }
  100% {
    color: #15394C;
    transform: scale(1);
  }
}
.sensor-table > table {
  table-layout: fixed;
  min-width: 320px;
}
.sensor-table .text-state {
  display: inline-block;
  color: #15394C;
}
.sensor-table .text-state.text-state--updated {
  animation: text-scale;
  animation-duration: 3s;
  animation-timing-function: ease-in;
}
.sensor-table .table-state-header {
  width: 75px;
}
@media (min-width: 736px) {
  .sensor-table .table-state-header {
    width: 147px;
  }
}
.sensor-table table.md-table.md-row-select td.md-cell:first-child, .sensor-table table.md-table.md-row-select th.md-column:first-child {
  padding: 0 0 0 20px;
}
.sensor-table table.md-table.md-row-select td.md-cell:nth-child(2), .sensor-table table.md-table.md-row-select th.md-column:nth-child(2) {
  padding: 0 20px;
}
.sensor-table table.md-table:not(.md-row-select) td.md-cell:first-child, .sensor-table table.md-table:not(.md-row-select) th.md-column:first-child {
  padding: 0 12px;
}
.sensor-table table.md-table tbody.md-body > tr.md-row:not(.md-row-active):hover {
  background-color: rgba(103, 159, 186, 0.1) !important;
}
.sensor-table table.md-table td.md-cell {
  overflow-wrap: break-word;
}
.sensor-table table.md-table td.md-cell .dt-thing_name {
  margin-top: 10px;
  margin-bottom: 10px;
  line-height: 1.4;
  min-width: 60px;
}
.sensor-table table.md-table td.md-cell .description {
  font-size: 0.9em;
  font-weight: normal !important;
  opacity: 0.6;
}
.sensor-table table.md-table td.md-cell:last-child,
.sensor-table table.md-table th.md-column:last-child {
  padding: 0 8px 0 0;
}
@media (min-width: 736px) {
  .sensor-table table.md-table td.md-cell:last-child,
  .sensor-table table.md-table th.md-column:last-child {
    padding: 0 24px 0 0;
  }
}
.sensor-table table.md-table md-checkbox {
  width: 24px;
}
.sensor-table table.md-table md-checkbox .md-container {
  margin-top: 23px;
}
.sensor-table table.md-table:not(.md-row-select) td.md-cell:nth-child(n+2):nth-last-child(n+2), .sensor-table table.md-table:not(.md-row-select) th.md-column:nth-child(n+2):nth-last-child(n+2) {
  padding: 0 16px 0 0;
}

.dialog-sensor-table > table {
  table-layout: auto;
}
@media (min-width: 736px) {
  .dialog-sensor-table > table {
    table-layout: fixed;
  }
}

.dt-table thead .sensor-table__cell-xs {
  width: 24px;
}
.dt-table table.md-table th {
  font-size: 12px !important;
  color: rgb(90, 110, 140) !important;
}
.dt-table table.md-table th md-icon.md-sort-icon {
  color: rgb(90, 110, 140) !important;
}
.dt-table table.md-table .md-active .md-sort-icon.md-asc md-icon:first-child {
  opacity: 1;
}
.dt-table table.md-table .md-active .md-sort-icon.md-desc md-icon:last-child {
  opacity: 1;
}
.dt-table table.md-table .md-sort-icon {
  display: inline-block;
  position: relative;
  width: 14px;
  height: inherit;
  vertical-align: top;
}
.dt-table table.md-table .md-sort-icon md-icon {
  position: absolute;
  left: 0;
  width: 14px;
  height: 14px;
  font-size: 14px !important;
  line-height: 14px !important;
  min-height: 14px;
  min-width: 14px;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0.5;
}
.dt-table table.md-table .md-sort-icon md-icon:first-child {
  top: -2px;
}
.dt-table table.md-table .md-sort-icon md-icon:last-child {
  top: 6px;
  transform: rotateZ(180deg);
}

.md-custom-column-arrow.table-sortable {
  min-width: 12px !important;
  width: 12px !important;
  height: 12px !important;
  min-height: 12px !important;
  vertical-align: middle !important;
  margin-left: 2px !important;
  transform: rotate(0deg) !important;
}
.md-active .md-custom-column-arrow.table-sortable {
  display: none !important;
}
.md-custom-column-arrow.table-sorted {
  min-width: 9px !important;
  width: 9px !important;
  height: 9px !important;
  min-height: 9px !important;
  vertical-align: middle !important;
  display: none !important;
  margin-left: 5px !important;
}
.md-active .md-custom-column-arrow.table-sorted {
  display: inline-block !important;
}

.dt-chips md-chips {
  max-width: 100%;
  width: 100%;
}
.dt-chips .md-chips {
  margin: 0 2px;
  padding: 0 8px;
  font-size: 16px;
}
.dt-chips .md-chips .md-chip-input-container {
  margin: 0 8px 0 0;
}
.dt-chips.contact-groups-chips md-chips-wrap {
  padding-left: 0;
}
.dt-chips.contact-groups-chips md-chips-wrap md-chip {
  border-radius: 6px;
  font-weight: 600;
  line-height: 28px;
  margin-left: 0;
  border: 1px solid #8fbbeb;
  background-color: #f0f8ff;
}
.dt-chips.contact-groups-chips md-chips-wrap md-chip .md-chip-remove {
  transform: scale(0.9);
}
.dt-chips md-chip {
  background-color: #cecece;
  height: 28px;
  line-height: 28px;
  margin: 4px 8px 4px 0;
}
.dt-chips md-chip.md-focused {
  background-color: #cdd5df !important;
}
.dt-chips md-chip .md-chip-remove {
  width: 28px;
  height: 28px;
}
.dt-chips md-chip .md-chip-remove md-icon {
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
  color: #616161;
}
.dt-chips md-chip ~ .md-chip-input-container {
  height: 36px;
}
.dt-chips md-chip ~ .md-chip-input-container md-autocomplete-wrap,
.dt-chips md-chip ~ .md-chip-input-container .md-input {
  height: 36px;
}
.dt-chips .md-contact-avatar {
  float: left;
  height: 26px;
}
.dt-chips .md-contact-avatar img {
  height: 26px;
  border-radius: 15px;
}
.dt-chips .md-contact-name {
  display: block;
  height: 26px;
  margin-left: 8px;
  font-size: 14px;
}
.dt-chips .md-icon-button {
  min-width: 40px;
  margin-right: -8px;
}
.dt-chips.dt-chips--editing .md-chips {
  box-shadow: 0 0 0 transparent inset, 0 1px 0 0 #e0e0e0 !important;
}
.dt-chips.dt-chips--editing md-chips-wrap {
  background-color: #fff;
}
.dt-chips.dt-chips--editing md-chips {
  margin-right: -40px;
}
.dt-chips.dt-chips--editing .md-chips {
  padding: 2px 8px;
}
.dt-chips.dt-chips--editing .md-chips.md-focused {
  box-shadow: 0 0 0 transparent inset, 0 1px 0 0 #c1c1c1;
}
.dt-chips.dt-chips--editing .md-chip-input-container input {
  font-size: 14px;
}

dt-things-list {
  position: relative;
}
dt-things-list .table-container .md-body > tr:first-child > td {
  border-top-width: 1px;
}

dt-loader {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  z-index: 9999;
}
dt-loader md-progress-linear {
  height: 3px;
}
dt-loader md-progress-linear .md-container {
  height: 3px;
  background-color: transparent;
}
dt-loader md-progress-linear .md-container .md-bar {
  background-color: #EC6A3E;
}

dt-block-fake {
  display: block;
  background-color: #fff;
}
dt-block-fake table {
  width: 100%;
}
dt-block-fake table td {
  height: 10px;
  border: 7px solid #fff;
  border-bottom-width: 25px;
  background-color: #f2f2f2;
}
dt-block-fake table td.cell-icon {
  width: 48px;
}
dt-block-fake table td.cell-icon-half {
  width: 24px;
}
dt-block-fake .fake-line {
  height: 10px;
  background-color: #f2f2f2;
  margin: 7px 7px 25px;
}
dt-block-fake .fake-round {
  width: 60px;
  height: 60px;
  background-color: #f2f2f2;
  border-radius: 50%;
  margin: 5px 15px 10px 0;
}
dt-block-fake .fake-square {
  width: 60px;
  height: 60px;
  background-color: #f2f2f2;
  border-radius: 2px;
  margin: 5px 15px 10px 0;
}
dt-block-fake .fake-triangle {
  width: 0;
  height: 0;
  border-width: 30px 50px;
  border-style: solid;
  border-color: transparent;
  border-top-color: #f2f2f2;
  border-radius: 2px;
  margin: 5px 15px 10px 0;
}

.chart {
  display: block;
  width: 100%;
}

.highcharts-range-selector {
  margin: 0 4px;
}

.popover {
  display: block;
  outline: none;
  position: absolute;
  z-index: 100;
  right: 0;
  top: 100%;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgb(218, 220, 232), 0 15px 35px 0 rgba(49, 49, 93, 0.1), 0 5px 15px 0 rgba(0, 0, 0, 0.08);
  background-color: #fff;
  border-radius: 5px;
  min-width: 280px;
}
.dt-layout-header__user-info .popover {
  margin-top: 22px;
}

.popover__wrap {
  overflow: hidden;
  position: relative;
  z-index: 102;
  background-color: #fff;
  color: #207da9;
  border-radius: 2px;
}
@media (min-width: 736px) {
  .popover__wrap.new-features {
    min-width: 400px;
  }
}
.popover__wrap.feedback {
  min-width: 320px;
}
@media (min-width: 736px) {
  .popover__wrap.links {
    min-width: 320px;
  }
}

.feedback-textarea {
  outline: 0;
  resize: none;
  border: none;
  font-size: 13px;
  line-height: 16px;
  padding: 14px;
  width: 100%;
  background: transparent;
  box-sizing: border-box;
  flex-grow: 1;
  height: 120px;
}

.popover__header {
  background-color: rgb(246, 248, 250);
  border-bottom: 1px solid rgba(218, 220, 232, 0.8);
  text-align: center;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  padding: 10px 14px;
}
.popover__header .header-text {
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}

.popover__content {
  margin: 20px 25px;
  font-size: 13px;
  color: #000000;
}

.popover__link {
  font-weight: 600;
}
.popover__link md-icon {
  width: 16px;
  min-width: 16px;
  height: 16px;
  min-height: 16px;
  margin-top: 2px;
  vertical-align: text-top;
}

.popover__info-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.popover__content-image {
  position: relative;
  margin-right: 20px;
  overflow: hidden;
  border-radius: 50%;
  display: inline-block;
  vertical-align: top;
  min-width: 36px;
}
.popover__content-image g,
.popover__content-image path {
  fill: rgb(90, 110, 140);
}

.popover__image-change {
  position: absolute;
  line-height: 2;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #232d33;
  color: rgba(255, 255, 255, 0.8);
  font-size: 11px;
  text-align: center;
  transition: all 0.1s ease-out;
}
.popover__content-image:hover .popover__image-change {
  line-height: 3;
  color: rgb(255, 255, 255);
}

.popover__content-info {
  display: inline-block;
  vertical-align: top;
}

.popover__separator {
  width: 100%;
  height: 0px;
  border-top: 1px solid rgba(90, 110, 140, 0.2);
}

.popover__footer {
  padding: 5px 0;
  width: 100%;
  border-top: 1px solid rgba(90, 110, 140, 0.2);
  background-color: rgb(252, 252, 253);
}
.popover__footer .feedback-buttons {
  display: flex;
  justify-content: flex-start;
}
.popover__footer .feedback-buttons .progress-indicator {
  align-self: center;
  margin-left: 12px;
}
.popover__footer .include-email {
  display: flex;
  align-items: center;
  padding-left: 12px;
}
.popover__footer .include-email .md-container {
  transform: none;
  margin-top: 3px;
}
.popover__footer .include-email .md-label {
  margin-bottom: 0;
  margin-top: 1px;
  margin-left: 24px;
}
.popover__footer__text {
  font-size: 12px;
  line-height: 20px;
  margin: 6px 14px;
  color: rgba(21, 57, 76, 0.85);
}
.popover__footer__text .link {
  font-weight: 600;
}

.popover__footer-control {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.popover-preferences {
  margin-top: 16px;
}
.popover-preferences__title {
  font-size: 16px;
}
.popover-preferences__subtitle {
  font-size: 12px;
  color: rgb(90, 110, 140);
}
.popover-preferences__subtitle md-icon {
  width: 16px;
  min-width: 16px;
  height: 16px;
  min-height: 16px;
  margin-left: 4px;
  margin-bottom: 2px;
}
.popover-preferences__radio-group {
  padding-top: 2px;
  display: flex;
}
.popover-preferences__radio-item {
  flex-grow: 1;
  margin-bottom: 0;
}

.popover .new-features {
  max-height: 80vh;
  overflow-y: scroll;
}
.popover .new-features .text-container {
  color: #3c4257;
  margin: 22px 30px;
}
.popover .new-features .text-container .feature-title {
  margin: 0;
  font-weight: 600;
}
.popover .new-features .text-container .code-banner {
  width: 100%;
  text-align: center;
  background-color: #EFF1F5;
  border-radius: 8px;
  padding: 24px 0;
}
.popover .new-features .text-container .feature-image {
  width: 100%;
  border-radius: 8px;
  margin-top: 12px;
  margin-bottom: 12px;
}
.popover .new-features .text-container .feature-image.extended-storage {
  background-color: #f1f3f7;
  border: 1px dashed #dddfe3;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' width='32' height='32' fill='none' stroke='%23ececf080'%3e%3cpath d='M0 .5H31.5V32'/%3e%3c/svg%3e");
}
.popover .new-features .text-container .feature-image.extended-storage .text-container {
  text-align: center;
  font-weight: 600;
  font-size: 16px;
  margin: 50px 0;
}
.popover .new-features .text-container .feature-image.extended-storage .text-container .year-container {
  border: 1px solid #5BBF71;
  background-color: #F2FDF6;
  border-radius: 8px;
  box-shadow: 0 6px 8px -4px rgba(63, 132, 78, 0.2);
  font-size: 18px;
  font-weight: 600;
  color: #3D9251;
  padding: 4px 20px;
  width: max-content;
  margin: 12px auto auto auto;
}
.popover .new-features .text-container .feature-text {
  margin: 6px 0 0 0;
  line-height: 1.6;
}
.popover .new-features .text-container .feature-text .link-icon {
  margin-left: 2px;
  margin-bottom: 1px;
  height: 12px;
  min-height: 12px;
  width: 12px;
  min-width: 12px;
}
.popover .new-features .text-container ul {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 14px;
}
.popover .new-features .text-container ul li {
  padding-left: 2px;
  padding-bottom: 4px;
  font-size: 0.96em;
}
.popover .new-features .text-container .feature-date {
  margin: 0;
  margin-top: 10px;
  opacity: 0.7;
  font-size: 12px;
}

.info-hint {
  position: relative;
  display: inline-block;
  line-height: 18px;
  margin-bottom: 1px;
}
.info-hint md-icon {
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  opacity: 0.7;
}
.info-hint .popover {
  overflow: visible;
  white-space: normal;
  margin-bottom: 30px;
  margin-left: -156px;
  left: 50%;
  top: auto;
  bottom: 0;
  padding: 16px;
  font-size: 13px;
  transition: all 0.15s ease-out;
}
.info-hint .popover md-icon {
  color: inherit !important;
}
.info-hint .popover.small {
  min-width: 180px;
  margin-left: -106px;
}
.info-hint .popover.medium {
  min-width: 240px;
  margin-left: -136px;
}
.info-hint .popover.below {
  top: calc(100% + 8px);
  bottom: auto;
  margin-bottom: 0;
}
.info-hint .popover.below::before {
  bottom: auto;
  top: -20px;
}
.info-hint .popover.below::after {
  bottom: auto;
  top: -6px;
}
.info-hint .popover::before {
  content: "";
  display: block;
  width: 100%;
  height: 20px;
  background: transparent;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: -20px;
}
.info-hint .popover::after {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: #fff;
  transform: rotate(45deg);
  border-radius: 4px;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: -6px;
}
.info-hint:hover md-icon {
  opacity: 1;
}
.info-hint:not(:hover) .popover {
  display: none;
  opacity: 0;
  transform: scale(0.96);
  pointer-events: none;
}

.dt-badge {
  background-color: rgba(90, 110, 140, 0.08);
  border-radius: 5px;
  font-size: 0.85em;
  line-height: 18px;
  text-align: center;
  letter-spacing: 0.02em;
  font-family: "Open Sans", sans-serif;
  color: rgba(21, 57, 76, 0.85);
  display: inline-block;
  padding: 1px 6px;
  font-weight: 600 !important;
  border: 1px solid rgba(21, 57, 76, 0.1);
}
.dt-badge md-icon path {
  fill: rgba(21, 57, 76, 0.85);
}
.dt-badge.warning {
  background-color: #f8e5b9;
  color: #914b00;
  border-color: rgba(145, 75, 0, 0.2);
}
.dt-badge.error {
  background-color: #fee3e3;
  color: #b8050b;
  border-color: rgba(184, 5, 11, 0.2);
}
.dt-badge.selected {
  background-color: #fff;
}
.dt-badge.blue {
  color: #207da9;
  background-color: rgba(32, 125, 169, 0.15);
}
.dt-badge.green {
  color: #0e6248;
  background-color: #cbf4c7;
  border-color: rgba(14, 98, 72, 0.2);
}
.dt-badge.white {
  background-color: rgba(90, 110, 140, 0);
  border-color: rgba(90, 110, 140, 0.25);
  white-space: nowrap;
}
.dt-badge.battery {
  padding-right: 8px;
  margin-top: 2px;
  font-size: 12px;
  line-height: 22px;
  text-transform: none;
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
}
.dt-badge.battery md-icon {
  margin: 0 4px 0 1px;
  transform: scale(0.88);
}
.dt-badge.battery md-icon path {
  fill: none;
}
.dt-badge.battery__ok {
  border: 1px solid rgba(14, 98, 72, 0.15);
  background-color: rgba(203, 244, 199, 0.45);
}
.dt-badge.battery__ok md-icon {
  color: rgba(14, 98, 72, 0.8);
}
.dt-badge.battery__low {
  border: 1px solid rgba(255, 150, 21, 0.7);
  background-color: rgba(255, 150, 21, 0.07);
  color: rgba(21, 57, 76, 0.95);
}
.dt-badge.battery__low md-icon {
  color: #FF9615;
}
.dt-badge.battery__critical {
  border: 1px solid rgba(90, 110, 140, 0.2);
  background-color: rgba(90, 110, 140, 0.05);
  color: rgba(21, 57, 76, 0.95);
}
.dt-badge.battery__critical md-icon {
  color: #ed1c24;
}
.dt-badge.battery__unknown {
  border: 1px solid rgba(90, 110, 140, 0.2);
  background-color: rgba(90, 110, 140, 0.05);
  color: rgba(21, 57, 76, 0.5);
}
.dt-badge.cellular {
  padding-right: 8px;
  margin-top: 2px;
  font-size: 12px;
  line-height: 22px;
  text-transform: none;
  border-radius: 5px;
  display: flex;
  align-items: center;
}
.dt-badge.cellular__things-list {
  position: absolute;
  right: 0;
  top: -19px;
  width: max-content;
}
.dt-badge.cellular__good {
  border: 1px solid rgba(14, 98, 72, 0.15);
  background-color: rgba(203, 244, 199, 0.45);
}
.dt-badge.cellular__good md-icon {
  margin-right: 6px;
}
.dt-badge.cellular__good md-icon path {
  fill: rgba(14, 98, 72, 0.8);
}
.dt-badge.cellular__weak {
  border: 1px solid rgba(255, 150, 21, 0.7);
  background-color: rgba(255, 150, 21, 0.07);
  color: rgba(21, 57, 76, 0.95);
}
.dt-badge.cellular__weak md-icon {
  margin: 0px 4px 0px -2px;
}
.dt-badge.cellular__weak md-icon path {
  fill: #FF9615;
}
.dt-badge.cellular__offline {
  border: 1px solid rgba(90, 110, 140, 0.2);
  background-color: rgba(90, 110, 140, 0.05);
  color: rgba(21, 57, 76, 0.95);
}
.dt-badge.cellular__offline md-icon {
  margin: 0px 4px 0px 1px;
  transform: scale(0.88);
}
.dt-badge.cellular__offline md-icon path {
  fill: #ed1c24;
}

.battery-info-hint {
  position: absolute;
}
.battery-info-hint--ok {
  margin-left: 58px;
}
.battery-info-hint--low {
  margin-left: 66px;
}
.battery-info-hint--critical {
  margin-left: 84px;
}

.md-button {
  font-size: 13px;
  font-weight: 600;
}

.validation-aware-block {
  display: flex;
  flex-direction: column;
}
.validation-aware-block__button[disabled] {
  color: #737678;
}
.validation-aware-block__button[disabled] + .validation-aware-block__message {
  display: block;
}
.validation-aware-block__message {
  font-size: 12px;
  color: rgb(90, 110, 140);
  margin-right: 8px;
  display: none;
}
.validation-aware-block--error .validation-aware-block__message {
  color: #cf252b;
}

.md-button.md-raised:not([disabled]) {
  height: 48px;
  border-radius: 3px;
  text-transform: none;
  margin-left: 0;
  margin-right: 0;
  margin-top: 20px;
  font-weight: normal;
  box-shadow: none !important;
}
.md-button.md-raised:not([disabled]) path {
  fill: #fff;
}
@media (min-width: 736px) {
  .md-button.md-raised:not([disabled]) {
    height: auto;
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 16px;
    padding: 2px 14px;
  }
}

.dt-theme.md-button {
  background-color: #207da9;
}
.dt-theme.md-button.md-primary.md-raised:not([disabled]):hover, .dt-theme.md-button.md-primary.md-fab:not([disabled]):hover {
  background-color: rgb(25.6, 100, 135.2);
}
.dt-theme.md-button.md-primary.md-raised:not([disabled]):active, .dt-theme.md-button.md-primary.md-fab:not([disabled]):active {
  background-color: rgb(20.48, 80, 108.16);
}
.dt-theme.md-button.md-button--cornered {
  border-radius: 0;
}
.dt-theme.md-button.md-button--with-icon .material-icons {
  font-size: 18px;
  margin: 0;
  padding: 0;
  line-height: 20px;
}
.dt-theme.md-button.md-button--s {
  font-weight: 400;
  text-transform: none;
}
.dt-theme.md-button.md-button--xs {
  text-transform: none;
  font-weight: normal;
  font-size: 12px;
  line-height: 30px;
  min-height: 30px;
}
.dt-theme.md-button.md-button--xxs {
  font-size: 12px;
  line-height: 20px;
  min-height: 20px;
  margin-bottom: 4px;
  margin-top: 4px;
}
.dt-theme.md-button.md-button--smaller.md-icon-button {
  margin: 0 2px;
  height: 24px;
  width: 24px;
  min-width: 0;
  min-height: 0;
  padding: 2px;
}
.dt-theme.md-button.md-button--smaller .material-icons {
  height: 18px;
  width: 18px;
  min-height: 18px;
  min-width: 18px;
  font-size: 18px;
}
.dt-theme.md-button.md-button--bigger {
  border-radius: 2px;
  font-family: "Open Sans", sans-serif;
  font-size: 12px;
  color: #fff;
  padding: 8px 20px;
  font-weight: 400;
}
.dt-theme.md-button.md-button--small {
  min-width: 38px;
  min-height: 28px;
  line-height: 28px;
  font-size: 11px;
  letter-spacing: 0.3px;
  color: #fff;
}

.dt-theme .md-button.md-fab md-icon {
  color: #fff;
}

.md-button--icon {
  margin: 0;
  padding: 0;
  box-shadow: none !important;
  border-radius: 0;
  min-height: 30px;
  line-height: 30px;
  min-width: 30px;
}

.list-button .list-button__content {
  margin-left: -4px;
}
.list-button .md-button {
  margin-left: 4px;
  margin-right: 4px;
}

.md-button.md-button--padded {
  padding-left: 15px;
  padding-right: 15px;
}

.md-button.md-button--rectangled {
  border-radius: 0;
  font-weight: normal;
  color: #fff;
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  text-transform: none;
  padding-left: 15px;
  padding-right: 15px;
}

.md-icon-button.mobile-width {
  min-width: none;
}
.md-icon-button.md-icon-button--s {
  margin: 0 2px;
  height: 24px;
  width: 24px;
  min-height: 24px;
  min-width: 24px;
  padding: 2px;
  line-height: 20px;
}
.md-icon-button.effect-rollover .effect-rollover__arrow {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -12px;
  margin-top: -12px;
  opacity: 0;
  color: rgba(255, 255, 255, 0.7);
  transition: margin-left 0.15s ease, opacity 0.15s ease, color 0.15s ease;
}
.md-icon-button.effect-rollover .material-icons {
  color: rgba(255, 255, 255, 0.8);
  position: relative;
  left: 0;
  transform: none;
  transition: left 0.15s ease, transform 0.15s ease, color 0.15s ease;
}
.md-icon-button.effect-rollover.is-active .material-icons, .md-icon-button.effect-rollover:hover .material-icons {
  position: relative;
  left: -6px;
  color: #fff;
}
.md-icon-button.effect-rollover.is-active .effect-rollover__arrow, .md-icon-button.effect-rollover:hover .effect-rollover__arrow {
  margin-left: 1px;
  opacity: 1;
  color: #fff;
}

.md-button.md-fab.md-mini {
  min-width: 40px;
}

.disabled-button-tooltip-wrapper {
  display: inline-block;
}
.disabled-button-tooltip-wrapper [disabled] {
  pointer-events: none;
}

md-slider {
  height: 38px;
  user-select: none;
}
md-slider .md-thumb {
  transform: scale(1) !important;
  animation: none !important;
  top: 8px;
  cursor: grab;
}
md-slider .md-thumb:active {
  cursor: grabbing !important;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 6px rgba(75, 143, 216, 0.2), 0px 3px 7px -1px rgba(60, 66, 88, 0.16);
}
md-slider .md-thumb:after {
  border-width: 0;
  background-color: white;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(60, 66, 88, 0.16), 0px 3px 7px -1px rgba(60, 66, 88, 0.16);
}
md-slider .md-focus-thumb, md-slider .md-focus-ring {
  display: none;
  opacity: 0;
}
md-slider .md-track-container {
  top: 16px;
  height: 4px;
  cursor: pointer;
}
md-slider .md-track-container .md-track {
  border-radius: 3px;
  background-color: #DADCE8;
}
md-slider .md-track-container .md-track.md-track-fill {
  background-color: rgb(75, 143, 216);
}

md-divider.md-primary {
  border-top-color: #859595;
}
md-divider.style-1 {
  border-top-color: #bdbdbd;
}

md-list.md-list--style-1 md-list-item {
  min-height: 36px !important;
}
md-list.md-list--style-2 .content-title {
  margin: 16px 0 0;
}
md-list.md-list--style-2 md-list-item .md-list-item-inner {
  padding-left: 0;
  padding-right: 0;
}
md-list.md-list--style-2 md-list-item .material-icons {
  vertical-align: top;
  line-height: 20px;
}
md-list.md-list--style3 .md-2-line .md-avatar {
  width: 50px;
  height: 50px;
}
md-list.md-list--style3 .md-2-line .md-list-item-text h3 {
  color: #e8833a;
  font-size: 18px;
  font-weight: 400;
}
md-list.md-list--style3 .md-2-line .md-list-item-text a[href^="mailto:"] {
  font-weight: 400;
  color: #e7a270;
  font-size: 14px;
}

md-autocomplete {
  display: block;
  box-sizing: border-box;
  border-radius: 4px;
  border: 0 solid transparent;
  position: relative;
  height: 38px;
  background-color: #fff;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 1px rgba(60, 66, 88, 0.12), 0px 2px 5px 0px rgba(60, 66, 88, 0.08);
}
md-autocomplete .md-whiteframe-z1 {
  box-shadow: none;
}
md-autocomplete.md-autocomplete--s {
  height: 36px;
}
md-autocomplete.md-autocomplete--s md-autocomplete-wrap {
  height: 36px;
}
md-autocomplete.md-autocomplete--s input:not(.md-input) {
  height: 36px;
  line-height: 36px;
}

.md-autocomplete-suggestions-container {
  z-index: 102 !important;
}

.md-open-menu-container {
  border-radius: 8px;
  background-color: #fff;
  padding: 8px;
  border: 1px solid rgb(218, 220, 232);
  box-shadow: 0px 0px 1px rgba(10, 20, 40, 0.05), 0px 2px 6px -4px rgba(20, 60, 100, 0.15), 0px 8px 20px -12px rgba(45, 95, 150, 0.3);
}
.md-open-menu-container md-menu-content {
  padding: 0;
}
.md-open-menu-container md-menu-content md-menu-item {
  color: #15394C;
}
.md-open-menu-container md-menu-content md-menu-item .md-button {
  border-radius: 5px;
  font-size: 14px;
}
.md-open-menu-container md-menu-content.menu-content--style-1 md-menu-item {
  padding-left: 16px !important;
  padding-right: 16px !important;
  min-height: 36px;
  height: 36px;
}
.md-open-menu-container md-menu-content.menu-content--style-1 md-radio-button {
  margin: 0;
}
.md-open-menu-container md-menu-content.menu-content--style-1 md-radio-button .md-label {
  font-size: 14px;
  margin-left: 16px;
  line-height: 36px;
}

.md-active.md-open-menu-container > md-menu-content > * {
  transition: none;
}

.md-panel-inner-wrapper .md-tooltip {
  color: white;
  vertical-align: middle;
  font-size: 11px;
  border-radius: 4px;
  background-color: #3e4a4f;
  box-shadow: 0 4px 14px -2px rgba(40, 40, 80, 0.2);
}

.md-panel-is-showing {
  z-index: 101 !important;
}

md-tooltip.dt-theme {
  overflow: visible;
  border-radius: 2px;
  max-width: 354px;
}
md-tooltip.dt-theme .md-content {
  border-radius: 2px;
  background-color: #207da9;
  opacity: 1;
  overflow: visible;
  height: auto;
  white-space: normal;
  line-height: 1.3;
  padding: 5px 8px 6px;
}
md-tooltip.dt-theme .md-content::after {
  content: "";
  position: absolute;
  display: block;
  border-radius: 2px;
  border: 5px solid #207da9;
}
md-tooltip.dt-theme span {
  font-size: 10px;
  color: #fff;
  font-weight: 600;
}

md-tooltip.dt-theme[md-direction=top] .md-content::after {
  bottom: -9px;
  left: 50%;
  margin-left: -5px;
  border-left-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
}

md-tooltip.dt-theme[md-direction=right] .md-content::after {
  top: 50%;
  left: -9px;
  margin-top: -5px;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
}

md-tooltip.dt-theme[md-direction=bottom] .md-content::after {
  top: -9px;
  left: 50%;
  margin-left: -5px;
  border-left-color: transparent;
  border-right-color: transparent;
  border-top-color: transparent;
}

md-tooltip.dt-theme[md-direction=left] .md-content::after {
  top: 50%;
  right: -9px;
  margin-top: -5px;
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-top-color: transparent;
}

md-radio-button .md-on,
md-radio-button.dt-theme .md-on,
md-radio-button.md-checked .md-on,
md-radio-button.dt-theme.md-checked .md-on {
  background-color: rgba(32, 125, 169, 0.8);
}

md-radio-button .md-off,
md-radio-button.md-checked .md-off,
md-radio-button.dt-theme .md-off,
md-radio-button.dt-theme.md-checked .md-off {
  border-color: transparent;
  box-shadow: 0px 1px 1px 0px rgba(45, 86, 155, 0.2), 0px 0px 0px 1px rgba(60, 66, 88, 0.2), 0px 1px 5px 0px rgba(60, 66, 88, 0.2);
}

md-checkbox:not(.md-checked) .md-icon,
md-checkbox.md-default-theme:not(.md-checked) .md-icon {
  border-color: transparent;
}

md-checkbox .md-icon,
md-checkbox.md-default-theme .md-icon {
  border-color: transparent !important;
  border-radius: 3px;
  box-shadow: 0px 1px 1px 0px rgba(45, 86, 155, 0.2), 0px 0px 0px 1px rgba(60, 66, 88, 0.2), 0px 1px 5px 0px rgba(60, 66, 88, 0.2);
}

md-checkbox.md-checked .md-icon,
md-checkbox.md-default-theme.md-checked .md-icon {
  background-color: #207da9;
  box-shadow: none;
}

md-checkbox .md-ink-ripple,
md-checkbox.md-default-theme .md-ink-ripple {
  color: rgba(32, 125, 169, 0.38);
}

md-checkbox .md-label {
  font-size: 14px;
  color: #15394C;
}

md-checkbox .md-container,
md-checkbox .md-icon, md-checkbox.dt-theme .md-container,
md-checkbox.dt-theme .md-icon {
  width: 16px;
  height: 16px;
}
md-checkbox .md-container::after, md-checkbox.dt-theme .md-container::after {
  top: -9px;
  right: -9px;
  bottom: -9px;
  left: -9px;
}

md-checkbox.md-checked .md-icon::after {
  width: 5px;
  height: 10px;
}

md-checkbox[disabled] .md-icon {
  opacity: 0.5;
}

md-dialog {
  border-radius: 8px;
  box-shadow: 0 0 0 1px white, 0 12px 40px -10px rgba(40, 40, 60, 0.4), 0 4px 20px -4px rgba(0, 0, 0, 0.25);
}
md-dialog.md-dialog--location {
  height: 80%;
}
md-dialog.md-dialog--s {
  width: 430px;
}
md-dialog.md-dialog--m {
  width: 640px;
}

.md-dialog-title {
  margin-bottom: 24px;
}

.md-dialog-container {
  height: 100% !important;
  position: fixed !important;
  top: 0 !important;
  z-index: 101;
}

md-backdrop.md-opaque {
  background-color: rgb(78, 80, 82);
}

.md-panel-container {
  transform: scale(0.85);
}
.md-panel-container.arrow {
  margin-top: 12px;
}
.md-panel-container.arrow::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: #fff;
  transform: rotate(45deg);
  border-radius: 4px;
  position: absolute;
  right: 12px;
  top: -6px;
  z-index: 103;
  margin-left: -9px;
}
.md-panel-container.arrow-gray::before {
  background: rgb(246, 248, 250);
  box-shadow: -1px -1px 0 0 rgba(218, 220, 232, 0.8);
}

.md-panel--animation {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.25s cubic-bezier(0, 1, 0.4, 1), transform 0.25s cubic-bezier(0.18, 1.25, 0.4, 1);
}

.dt-select .dt-option__hint {
  display: none;
}

@media (min-width: 736px) {
  .dt-select-container {
    min-width: auto !important;
    max-width: 240px;
  }
}
@media (min-width: 736px) {
  .dt-select-container--wider {
    max-width: 320px;
  }
}
.dt-select-container .dt-option {
  height: auto;
  padding-top: 14px;
  padding-bottom: 14px;
}
.dt-select-container .dt-option:not([disabled]):hover {
  background-color: rgba(255, 255, 255, 0.2);
}
.dt-select-container .dt-option:not([disabled]):focus {
  background-color: rgba(255, 255, 255, 0.3);
}
.dt-select-container .dt-option .md-text {
  white-space: normal;
}
.dt-select-container .dt-option__value {
  font-size: 14px;
  font-weight: 600;
  color: #17384c;
}
.dt-select-container .dt-option__hint {
  font-size: 12px;
  color: #697878;
}

md-menu-content.dt-menu md-menu-item .md-button:not([disabled]):hover {
  background-color: rgba(255, 255, 255, 0.2);
}
md-menu-content.dt-menu md-menu-item .md-button:not([disabled]):focus {
  background-color: rgba(255, 255, 255, 0.3);
}

.dt-layout-content {
  background-color: rgb(239, 241, 245);
  position: relative;
}
.dt-layout-content__container {
  background-color: rgb(239, 241, 245);
  transition: all 0.25s ease-out;
}
.dt-layout-content__container .floating-button {
  position: absolute;
  right: 24px;
  top: 40px;
}
@media (max-width: 735px) {
  .dt-layout-content__container .floating-button {
    top: 30px;
    right: 8px;
    padding: 0 5px;
  }
}
@media (min-width: 960px) {
  .dt-layout-content.dt-layout--with-error .dt-layout-content__container {
    margin-top: 136px;
  }
}
.dt-layout-content.dt-layout--with-error .dt-layout-content__container {
  position: relative;
}
@media (min-width: 960px) {
  .dt-layout-content.licenses-being-activated .dt-layout-content__container {
    margin-top: 100px;
  }
}
.dt-layout-content.no-menu .dt-layout-content__container {
  padding-left: 0;
}

@media (min-width: 960px) {
  .dt-layout--expanded .dt-layout-content__container {
    padding-left: 270px;
  }
  .dt-layout--collapsed .dt-layout-content__container {
    padding-left: 0;
  }
}
@media (min-width: 960px) {
  .dt-layout--with-error > dt-message-box {
    height: 136px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 16;
    backdrop-filter: blur(10px);
    margin-left: 270px;
  }
  .dt-layout--with-error > dt-message-box .alert-box {
    box-sizing: border-box;
    height: 100%;
    align-items: center;
  }
}
.dt-layout--with-error > dt-message-box .alert-box {
  margin: 0;
}

.dt-navbar {
  position: fixed;
  will-change: transform;
  width: 270px;
  display: flex;
  box-sizing: border-box;
  flex-direction: column;
  align-items: stretch;
  left: 0;
  bottom: 0;
  top: 0;
  background-color: #f6f8fa;
  border-right: 1px solid rgb(218, 220, 232);
  z-index: 16;
}
.dt-navbar md-icon {
  margin: 0;
}
.dt-navbar__logo {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  height: 42px;
  padding: 24px 16px 8px 16px;
}
.dt-navbar__list {
  flex: 1 1 auto;
  padding-bottom: 32px;
  transform: translate3d(0, 0, 0);
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: auto;
}
.dt-navbar__project {
  padding: 26px 14px 0 14px;
}
.dt-navbar__project.reduced-padding-top {
  padding-top: 12px;
}
.dt-navbar__project-and-qr-container .project-and-qr {
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 100%;
  border: 1px solid rgb(218, 220, 232);
  background-color: white;
  border-radius: 7px;
  transition: all 0.2s ease-in-out;
  box-shadow: 0 1px 4px -2px rgba(20, 40, 60, 0.2);
}
.dt-navbar__project-and-qr-container .project-and-qr:hover {
  cursor: pointer;
}
.dt-navbar__project-and-qr-container .project-and-qr p {
  margin: 0;
}
.dt-navbar__project-and-qr-container .project-and-qr .left-side {
  display: flex;
  flex-direction: row;
  align-items: center;
  border-top-left-radius: 7px;
  border-bottom-left-radius: 7px;
  transition: all 0.2s ease-in-out;
}
.dt-navbar__project-and-qr-container .project-and-qr .left-side:hover {
  box-shadow: 0 2px 6px -1px rgba(20, 40, 60, 0.12);
}
.dt-navbar__project-and-qr-container .project-and-qr .left-side .project-section {
  padding: 10px 0px 10px 12px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.dt-navbar__project-and-qr-container .project-and-qr .left-side .project-section .project-name {
  font-weight: 600;
  font-size: 1.05em;
}
.dt-navbar__project-and-qr-container .project-and-qr .left-side .project-section .organization-name {
  opacity: 0.7;
  font-size: 0.9em;
  width: 148px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-wrap: nowrap;
}
.dt-navbar__project-and-qr-container .project-and-qr .left-side .unfold {
  margin-right: 4px;
  transform: scale(0.9);
}
.dt-navbar__project-and-qr-container .project-and-qr .qr-section {
  display: flex;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  flex-grow: 1;
  width: 50px;
  border-left: 1px solid rgb(218, 220, 232);
  border-top-right-radius: 7px;
  border-bottom-right-radius: 7px;
  transition: all 0.2s ease-in-out;
}
.dt-navbar__project-and-qr-container .project-and-qr .qr-section:hover {
  box-shadow: 0 2px 6px -1px rgba(20, 40, 60, 0.12);
}
.dt-navbar__project-and-qr-container .project-and-qr .qr-section md-icon {
  opacity: 0.9;
}
.dt-navbar .local-time-container {
  border: 1px solid rgb(218, 220, 232);
  background-color: rgb(242, 244, 246);
  margin-top: 14px;
  margin-bottom: -10px;
  font-size: 0.9em;
  text-transform: none;
  line-height: normal;
  padding-left: 4px;
  padding-right: 4px;
  height: 26px;
  border-radius: 6px;
  display: flex;
  align-items: center;
}
.dt-navbar .local-time-container .local-time {
  margin-right: 8px;
}
.dt-navbar .local-time-container .hour-difference {
  border-left: 1px solid rgb(218, 220, 232);
  padding-left: 4px;
  padding-right: 4px;
  height: 100%;
  align-content: center;
  flex-grow: 1;
  text-align: center;
}
.dt-navbar .local-time-container md-icon {
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
  margin-right: 5px;
  transform: scale(0.8);
}
.dt-navbar__section {
  margin: 16px 0;
  flex-shrink: 0;
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  white-space: nowrap;
  box-shadow: none;
  transition: box-shadow 0.3s ease, padding 0.3s ease, width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.dt-navbar__section--home {
  padding-top: 6px;
  margin: 0;
  background-size: 256px 100px;
  box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.12) inset !important;
  height: 100px;
  max-height: 100px;
  box-sizing: border-box;
  position: relative;
  color: #fff;
}
.dt-navbar__section--home .dt-navbar-item {
  transition: margin-right 0.3s ease;
}
.dt-navbar__section--home .dt-navbar-item .dt-navbar-item__title {
  color: rgba(255, 255, 255, 0.8);
}
.dt-navbar__section--home .dt-navbar-item .md-button .material-icons {
  color: rgba(255, 255, 255, 0.8) !important;
}
.dt-navbar__section--home .dt-navbar-item .md-button .navbar-icon path {
  fill: #fff !important;
  fill-opacity: 0.8 !important;
}
.dt-navbar--collapsed .dt-navbar__section--home .dt-navbar-item {
  margin-right: 0;
}
.dt-navbar__section--home .current-project__title {
  color: #fff;
  padding: 0 18px;
  font-size: 14px;
  font-family: "Open Sans", sans-serif;
}
.dt-navbar__section--home .current-project__title:hover, .dt-navbar__section--home .current-project__title:focus {
  background-color: rgba(158, 158, 158, 0.2);
  outline: none;
}
.dt-navbar--collapsed .dt-navbar__section--home .current-project__title {
  visibility: hidden;
}
.dt-navbar__section--home .current-project__subtitle {
  padding: 0 18px;
  font-size: 12px;
  line-height: 1.8;
  margin-bottom: 6px;
  color: rgba(255, 255, 255, 0.8);
  font-family: "Open Sans", sans-serif;
}
.dt-navbar--collapsed .dt-navbar__section--home .current-project__subtitle {
  visibility: hidden;
}
.dt-navbar__section--home .dt-navbar-item.is-current .md-button {
  background-color: rgba(0, 0, 0, 0.6);
}
.dt-navbar__section--home .dt-navbar-item.is-current .md-button .material-icons {
  color: #679FBA !important;
}
.dt-navbar__section--home .dt-navbar-item.is-current .dt-navbar-item__title {
  color: #679FBA;
}
.dt-navbar__settings .md-button::after {
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: "liga";
  font-feature-settings: "liga";
  -webkit-user-select: none;
  /* stylelint-disable-next-line */
  font-family: "Material Icons";
  color: #17384c;
  content: "arrow_drop_down";
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -12px;
  transform: translateX(-12px) rotate(-90deg);
  opacity: 0;
  transition: transform 0.15s ease-in, opacity 0.075s ease;
}
.dt-navbar__settings .md-button .material-icons {
  color: #17384c;
  position: relative;
  transform: none;
  transition: transform 0.15s ease;
}
.dt-navbar__settings .md-button:hover::after {
  transform: translateX(-1px) rotate(-90deg);
  opacity: 1;
  transition: transform 0.15s ease-out, opacity 0.075s ease 0.075s;
}
.dt-navbar__settings .md-button:hover .material-icons {
  position: relative;
  transform: translateX(-4px) rotate(-20deg);
}
.dt-navbar__settings.dt-navbar__settings--expanded {
  position: absolute;
  right: 0;
  top: 10px;
  margin: 0;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  padding: 0;
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.3s ease 0.15s, transform 0.3s ease;
  transition: opacity 0.3s ease 0.15s, transform 0.3s ease;
}
.dt-navbar__settings.dt-navbar__settings--expanded .md-button {
  width: 36px;
  height: 36px;
  padding: 8px;
  margin: 0 4px;
}
.dt-navbar__heading {
  font-family: "Open Sans", sans-serif;
  margin: 0 0 15px 0;
  padding: 0 24px;
  overflow: hidden;
  cursor: default;
  user-select: none;
  color: #afb8b8;
  font-size: 12px;
  line-height: 1.25;
  text-transform: uppercase;
  transition: height 0.3s ease, opacity 0.3s ease 0.15s;
}
.dt-navbar__expand-button {
  display: block;
  flex: 0 0 auto;
  height: 44px;
  padding: 0;
  margin: 0;
  min-width: 0;
  background: #fafafa;
  border: 0;
  border-top: 1px solid #e2e2e2;
  border-radius: 0;
}
.dt-navbar__expand-button .material-icons {
  position: absolute;
  top: 10px;
  right: 22px;
  width: 24px;
  height: 24px;
  color: #17384c;
  pointer-events: none;
  transition: transform 0.3s ease;
  font-size: 24px;
}
@media (min-width: 736px) and (max-width: 959px) {
  .dt-navbar__expand-button {
    display: none;
  }
}
.dt-navbar .dt-navbar__settings--collapsed {
  padding: 0;
  max-height: 0;
  opacity: 0;
  transform: translate3d(0, -24px, 0);
  visibility: hidden;
  transition: max-height 0.3s ease, opacity 0.1s ease, transform 0.3s ease, visibility 0s linear 0.3s;
}
.dt-navbar .dt-navbar__settings--collapsed .md-button {
  margin: 0;
  height: 32px;
  min-width: 0;
  overflow: visible;
  width: 100%;
  border-radius: 0;
  color: #17384c;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 20px;
  text-decoration: none;
  text-transform: none;
  padding: 8px 24px;
  text-align: center;
}

.dt-navbar-item {
  outline: none;
}
.dt-navbar-item__lockup {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.dt-navbar-item__tooltip {
  font-family: "Open Sans", sans-serif;
  color: #fff;
}
.dt-navbar-item.border-top {
  border-top: 1px solid rgb(218, 220, 232);
}
.dt-navbar-item.organization {
  display: flex;
  flex-direction: column;
  position: relative;
  border-top: 1px solid rgb(218, 220, 232);
  border-bottom: 1px solid rgb(218, 220, 232);
  padding: 10px 0;
}
.dt-navbar-item.organization .active-alerts {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 8px;
  margin: 4px 16px 4px 16px;
  background-color: rgba(236, 106, 62, 0.06);
  border: 1px solid rgba(236, 106, 62, 0.2);
  border-radius: 6px;
  transition: all 0.2s ease;
}
.dt-navbar-item.organization .active-alerts.no-alerts {
  background-color: #E6F2E5;
  border: 1px solid rgba(60, 100, 70, 0.2);
}
.dt-navbar-item.organization .active-alerts.no-alerts:hover {
  background-color: #D4ECD6;
  border: 1px solid rgba(60, 100, 70, 0.25);
}
.dt-navbar-item.organization .active-alerts.no-alerts .left-side .text {
  color: #0E6248;
}
.dt-navbar-item.organization .active-alerts.no-alerts .right-side {
  color: #0E6248;
}
.dt-navbar-item.organization .active-alerts.no-alerts .right-side path {
  fill: #0E6248;
}
.dt-navbar-item.organization .active-alerts.shifted-up {
  margin-bottom: 10px;
}
.dt-navbar-item.organization .active-alerts:hover {
  background-color: rgba(236, 106, 62, 0.1);
  border: 1px solid rgba(236, 106, 62, 0.25);
  cursor: pointer;
}
.dt-navbar-item.organization .active-alerts:hover .right-side md-icon {
  transform: scale(1.05) translateX(1px);
}
.dt-navbar-item.organization .active-alerts .left-side {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.dt-navbar-item.organization .active-alerts .left-side .number-of-alerts {
  padding: 0 2px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  border-radius: 5px;
  background-color: #ee7446;
  border: 1px solid #d7511e;
  box-shadow: -1px 1px 5px 0px rgba(215, 81, 30, 0.5098039216);
  color: white;
  font-size: 0.92em;
  font-weight: 600;
  line-height: 12px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dt-navbar-item.organization .active-alerts .left-side .number-of-alerts path {
  stroke: white;
}
.dt-navbar-item.organization .active-alerts .left-side .text {
  color: #ca420f;
  font-weight: 600;
  font-size: 0.95em;
}
.dt-navbar-item.organization .active-alerts .right-side {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #ca420f;
}
.dt-navbar-item.organization .active-alerts .right-side md-icon {
  transition: all 0.2s ease;
}
.dt-navbar-item.organization .active-alerts .right-side md-icon path {
  fill: #ca420f;
}
.dt-navbar-item .md-button {
  margin: 0;
  min-width: 0;
  overflow: visible;
  width: 100%;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  border-radius: 0;
  color: #15394C;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 20px;
  text-align: start;
  text-decoration: none;
  text-transform: none;
  padding: 12px 24px;
}
.dt-navbar-item .md-button:hover {
  background-color: rgba(236, 106, 62, 0.05);
  border-top: 1px solid rgba(236, 106, 62, 0.12);
  border-bottom: 1px solid rgba(236, 106, 62, 0.12);
}
.dt-navbar-item .md-button .navbar-icon {
  height: 20px;
  width: 20px;
  min-height: 20px;
  min-width: 20px;
  line-height: 20px;
}
.dt-navbar-item .md-button .navbar-badge {
  position: absolute;
  top: 4px;
  left: 33px;
  width: 15px;
  height: 15px;
  min-width: 15px;
  min-height: 15px;
  border-radius: 50%;
  background-color: #ee7446;
  border: 1px solid #d7511e;
  box-shadow: -1px 1px 5px 0px rgba(215, 81, 30, 0.5098039216);
  color: white;
  font-size: 10px;
  font-weight: 600;
  line-height: 16px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dt-navbar-item .md-button .navbar-badge span {
  padding: 0;
}
.dt-navbar-item .md-button.child {
  padding-left: 42px;
}
.dt-navbar-item .md-button span {
  text-transform: capitalize;
  padding-left: 12px;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.dt-navbar-item .md-button .dt-navbar__feature-level {
  position: absolute;
  right: 16px;
  padding-left: 8px;
  padding-right: 8px;
  font-size: 10px;
  text-transform: uppercase;
  line-height: 20px;
  border-radius: 4px;
}
.dt-navbar-item .md-button .dt-navbar__feature-level.dt-navbar__alpha {
  background-color: rgb(162, 170, 176);
  color: #ffffff;
}
.dt-navbar-item .md-button .dt-navbar__feature-level.dt-navbar__beta {
  background-color: rgb(162, 170, 176);
  color: #ffffff;
}
.dt-navbar-item .md-button .material-icons {
  color: #17384c !important;
}
.dt-navbar-item .md-button .alert-icon {
  position: absolute;
  display: block;
  top: 2px;
  left: 32px;
  width: 18px;
  height: 16px;
  min-width: 18px;
  min-height: 16px;
}
.dt-navbar-item.is-current .md-button {
  background-color: rgba(236, 106, 62, 0.1);
  border-top: 1px solid rgba(236, 106, 62, 0.2);
  border-bottom: 1px solid rgba(236, 106, 62, 0.2);
  border-right: 2px solid #EC6A3E;
  color: #17384c !important;
}

.dt-navbar-simple-item {
  padding: 8px 24px;
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  color: #15394C;
  position: relative;
  border: 1px solid transparent;
}
.dt-navbar-simple-item.is-current {
  background-color: rgba(236, 106, 62, 0.1);
  border-top: 1px solid rgba(236, 106, 62, 0.2);
  border-bottom: 1px solid rgba(236, 106, 62, 0.2);
  border-right: 2px solid #EC6A3E;
}
.dt-navbar-simple-item.disabled {
  opacity: 0.6;
}
.dt-navbar-simple-item:visited {
  color: #15394C;
}
.dt-navbar-simple-item.org-section-header .expand-icon {
  margin-left: auto;
  transition: transform 0.2s ease;
  transform: rotate(0deg);
}
.dt-navbar-simple-item.org-section-header .expand-icon.expanded {
  transform: rotate(90deg);
}
.dt-navbar-simple-item .navbar-icon {
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
}
.dt-navbar-simple-item .navbar-icon path {
  fill: none;
  color: rgba(0, 0, 0, 0.54);
}
.dt-navbar-simple-item .title {
  padding-left: 8px;
  font-weight: 600;
  user-select: none;
  vertical-align: middle;
}
.dt-navbar-simple-item:hover {
  color: #15394C;
  transition: 0.2s all ease-in-out;
  background-color: rgba(236, 106, 62, 0.05);
  border-top: 1px solid rgba(236, 106, 62, 0.12);
  border-bottom: 1px solid rgba(236, 106, 62, 0.12);
}
.dt-navbar-simple-item .dt-navbar__feature-level {
  position: absolute;
  right: 8px;
  padding-left: 8px;
  padding-right: 8px;
  font-size: 10px;
  text-transform: uppercase;
  line-height: 20px;
  border-radius: 2px;
}
.dt-navbar-simple-item .dt-navbar__feature-level.dt-navbar__beta {
  background-color: rgb(162, 170, 176);
  color: #ffffff;
}
.dt-navbar-simple-item .billing-badge {
  position: absolute;
  right: 8px;
  padding: 2px 8px;
  font-size: 10px;
  border-radius: 4px;
  font-weight: 600;
  text-transform: uppercase;
  opacity: 0.9;
}
.dt-navbar-simple-item .billing-badge.beta {
  color: #7d858e;
  border: 1px solid #a5a5a5;
  background-color: #f8fbfe;
}
.dt-navbar-simple-item .billing-badge.warning {
  color: #d9651d;
  border: 1px solid #d9651d;
  background-color: white;
}
.dt-navbar-simple-item .billing-badge.danger {
  color: #d9461d;
  border: 1px solid #d9461d;
  background-color: #fde8e4;
}

.bottom-items {
  margin: 10px;
  height: 28px;
  border-radius: 6px;
  border: 1px solid rgb(218, 220, 232);
  display: flex;
}
.bottom-items__item {
  background-color: rgba(255, 255, 255, 0.5);
  display: flex;
  flex-grow: 1;
  align-items: center;
  justify-content: center;
  font-size: 0.92em;
  opacity: 0.9;
  font-weight: 600;
}
.bottom-items__item md-icon {
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  color: rgba(0, 0, 0, 0.54);
}
.bottom-items__item {
  transition: 0.2s all ease;
}
.bottom-items__item:hover {
  opacity: 1;
  background-color: white;
  cursor: pointer;
  box-shadow: 0 1px 4px -1px rgba(20, 40, 60, 0.2);
}
.bottom-items__divider {
  width: 1px;
  background-color: rgb(218, 220, 232);
}

@media only screen and (max-width: 959px) {
  .dt-navbar {
    top: 0;
    z-index: 100;
    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
    transform: translate3d(-256px, 0, 0);
    visibility: hidden;
    transition: transform 0.3s cubic-bezier(0.4, 0, 1, 1), visibility 0s ease 0.3s;
  }
  .mobile-nav-open .dt-navbar {
    transform: translate3d(0, 0, 0);
    visibility: visible;
    transition: transform 0.3s cubic-bezier(0, 0, 0.2, 1);
  }
}
@media only screen and (min-width: 960px) {
  .dt-navbar.dt-navbar--collapsed {
    width: 68px;
  }
  .dt-navbar.dt-navbar--collapsed .dt-navbar__list::-webkit-scrollbar {
    display: none;
  }
  .dt-navbar.dt-navbar--collapsed .dt-navbar__section:nth-child(2) {
    box-shadow: none;
  }
  .dt-navbar.dt-navbar--collapsed .dt-navbar__section .dt-navbar-item .md-button {
    padding-right: 0;
    border-right: none;
  }
  .dt-navbar.dt-navbar--collapsed .dt-navbar__heading {
    height: 0;
    margin: 0;
    opacity: 0;
    transition: height 0.3s ease, opacity 0.1s ease;
  }
  .dt-navbar.dt-navbar--collapsed .dt-navbar-item__title {
    opacity: 0;
  }
  .dt-navbar.dt-navbar--collapsed .dt-navbar__settings--expanded {
    opacity: 0;
    position: absolute;
    transform: translate3d(44px, 0, 0);
    visibility: hidden;
    transition: opacity, position 0.3s ease, transform 0.3s ease, visibility 0s linear 0.3s;
  }
  .dt-navbar.dt-navbar--collapsed .dt-navbar__settings--collapsed {
    max-height: 40px;
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: transform 0.3s ease, max-height 0.3s ease, opacity 0.15s ease 0.15s;
  }
  .dt-navbar.dt-navbar--collapsed .dt-navbar__expand-button .material-icons {
    transform: rotate(180deg);
  }
  .dt-navbar.dt-navbar--collapsed .dt-navbar-item .md-button {
    padding-left: 21px;
  }
  .dt-navbar.dt-navbar--collapsed .alert-icon {
    padding-left: 5px;
  }
}
@media only screen and (min-width: 960px) {
  .mobile-nav-scrim {
    display: none;
    visibility: hidden;
  }
}
@media only screen and (max-width: 959px) {
  .mobile-nav-scrim {
    background: rgba(0, 0, 0, 0.4);
    cursor: pointer;
    z-index: 20;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0s ease 0.3s;
  }
  .mobile-nav-open .mobile-nav-scrim {
    pointer-events: auto;
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease;
  }
}
@media (max-width: 735px) {
  .master-detail-container.layout-margin {
    margin: 0;
  }
  .master-detail-container.layout-margin > * {
    margin: 0;
  }
}
@media (min-width: 736px) {
  .master-detail-container.layout-margin {
    margin: 16px;
    padding-bottom: 32px;
  }
}

.master-view {
  flex-grow: 1;
  max-width: 100%;
}
.master-view .dt-table tbody.md-body > tr.md-row,
.master-view .dt-table .md-row-select tbody.md-body > tr.md-row {
  transition: background-color 0.2s;
  cursor: pointer;
}
.master-view .dt-table tbody.md-body > tr.md-row.md-selected,
.master-view .dt-table .md-row-select tbody.md-body > tr.md-row.md-selected {
  background-color: rgba(103, 159, 186, 0.2);
}
.master-view .dt-table tbody.md-body > tr.md-row:not(.md-row-active):hover,
.master-view .dt-table .md-row-select tbody.md-body > tr.md-row:not(.md-row-active):hover {
  background-color: rgba(103, 159, 186, 0.1) !important;
}
.master-view.master-view--with-detail {
  display: none;
}
@media (min-width: 736px) {
  .master-view.master-view--with-detail {
    max-width: 320px;
    min-width: 320px;
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 200px);
    align-self: stretch;
  }
  .master-view.master-view--with-detail md-table-container {
    flex-grow: 1;
    height: 0;
    overflow: auto;
  }
  .master-view.master-view--with-detail dt-things-list,
  .master-view.master-view--with-detail .emulator-device-list,
  .master-view.master-view--with-detail .data-connectors-list {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
  }
}
.master-view.master-view--with-detail .sensor-table > table {
  min-width: 0;
}
.master-view.master-view--with-detail tr.md-row-active td {
  color: #fff !important;
}
.master-view.master-view--with-detail .dt-table th.first-if-detail,
.master-view.master-view--with-detail .dt-table td.first-if-detail {
  padding-left: 10px !important;
}
.master-view.master-view--with-detail .dt-table td.last-if-detail,
.master-view.master-view--with-detail .dt-table th.last-if-detail {
  padding-right: 12px !important;
}
.master-view.master-view--with-detail .hide-if-detail {
  display: none;
}
.master-view.master-view--with-detail .transparent {
  background: transparent;
}
.master-view.master-view--with-detail .indentity-button-detail {
  width: 100%;
  margin-bottom: 8px;
  margin-right: 0;
}

.detail-view {
  flex-grow: 1;
}
.detail-view--invisible {
  display: none;
}
.detail-view__toolbar {
  position: relative;
  margin-bottom: 10px;
}
@media (min-width: 736px) {
  .detail-view__back-link {
    margin-top: 10px;
  }
}

.master-detail-container.empty-project {
  margin-top: 15vh;
}
@media (max-width: 735px) {
  .master-detail-container.empty-project {
    margin: 36px 0;
  }
}
.master-detail-container.empty-project .header {
  font-size: 18px;
  font-weight: 600;
}
.master-detail-container.empty-project .sub-header {
  margin-top: 0px;
  margin-bottom: 24px;
  font-size: 14px;
  opacity: 0.7;
  padding: 0 16px;
  text-align: center;
}
.master-detail-container.empty-project .helper-text {
  font-size: 14px;
  opacity: 0.7;
  text-align: center;
  margin-bottom: 8px;
}
.master-detail-container.empty-project .content-box {
  max-width: 680px;
}
@media (max-width: 735px) {
  .master-detail-container.empty-project .content-box {
    width: 100%;
  }
}
.master-detail-container.empty-project .content-box.faded {
  background-color: rgba(255, 255, 255, 0.55);
  box-shadow: none;
  padding: 0;
}
.master-detail-container.empty-project .content-box .illustration-container {
  margin-left: 16px;
  margin-right: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.master-detail-container.empty-project .content-box .illustration-container .illustration {
  width: 84px;
}
@media (max-width: 735px) {
  .master-detail-container.empty-project .content-box .text-section {
    text-align: center;
  }
}
.master-detail-container.empty-project .content-box .text-section .text-section-title {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 0px;
}
.master-detail-container.empty-project .content-box .text-section .text-section-paragraph {
  margin-top: 6px;
  opacity: 0.8;
}
.master-detail-container.empty-project .separator {
  width: 100%;
  height: 1px;
  background-color: rgb(218, 220, 232);
}
.master-detail-container.empty-project .icon-button {
  margin: 0 32px;
}
@media (max-width: 735px) {
  .master-detail-container.empty-project .icon-button {
    margin: 0;
  }
}

.projects-modal {
  background-color: rgb(248, 248, 250);
  transition: all 0.2s ease-in-out;
  flex-grow: 1;
}
@media (max-width: 1365px) {
  .projects-modal {
    height: 100%;
  }
}
@media (min-width: 960px) {
  .projects-modal {
    width: 580px;
  }
}
.projects-modal .mono-font {
  font-family: "Menlo", "monospace", "Open Sans";
}
.projects-modal .modal-header {
  position: sticky;
  top: 0;
  background-color: #fff;
  border-bottom: 1px solid rgb(218, 220, 232);
  z-index: 2;
  padding: 36px;
  padding-top: 36px;
  padding-bottom: 4px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0px 2px 6px rgba(10, 20, 40, 0.05);
}
@media (max-width: 735px) {
  .projects-modal .modal-header {
    padding: 12px;
  }
  .projects-modal .modal-header md-autocomplete {
    min-width: auto;
  }
  .projects-modal .modal-header md-autocomplete input {
    font-size: 16px;
  }
}
.projects-modal .modal-header .input-container.search-type {
  min-width: 100px;
  height: 36px;
  z-index: 2;
}
@media (max-width: 735px) {
  .projects-modal .modal-header .input-container.search-type {
    min-width: 112px;
  }
}
.projects-modal .modal-header .input-container.search-type .input-element {
  height: 36px;
  font-size: 13px;
  width: calc(100% - 14px);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
@media (max-width: 735px) {
  .projects-modal .modal-header .input-container.search-type .input-element {
    font-size: 16px;
  }
}
.projects-modal .modal-header md-autocomplete {
  z-index: 1;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.projects-modal .modal-header .input-container.device-input {
  z-index: 1;
}
.projects-modal .modal-header .input-container.device-input .input-element {
  height: 36px;
  font-weight: 400;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
@media (max-width: 735px) {
  .projects-modal .modal-header .input-container.device-input .input-element {
    font-size: 16px;
  }
}
.projects-modal .modal-header .input-container.device-input .input-right-text {
  top: 10px;
}
.projects-modal .modal-header .device-helper-text {
  margin: 0;
  padding-bottom: 8px;
  opacity: 0.6;
  overflow: visible;
}
.projects-modal .modal-header .device-helper-text.ng-hide-add {
  transition: all ease-out 0.2s;
}
.projects-modal .modal-header .device-helper-text.ng-hide-remove {
  transition: all ease-in 0.2s;
}
.projects-modal .modal-header .device-helper-text.ng-hide {
  max-height: 0;
  opacity: 0;
  padding: 0;
}
.projects-modal .table-container.hidden {
  display: none;
}
.projects-modal .table-container .recently-viewed-badge {
  display: flex;
  align-items: center;
  width: fit-content;
  width: -moz-fit-content;
  box-shadow: 0 0 1px 0 rgba(21, 57, 76, 0.8);
  background-color: rgba(255, 255, 255, 0.8);
  padding: 1px 5px;
  border-radius: 4px;
}
.projects-modal .content-container {
  padding: 36px;
  padding-top: 10px;
  padding-bottom: 20px;
  overflow: scroll;
  flex: 1 1 auto;
}
@media (max-width: 735px) {
  .projects-modal .content-container {
    padding: 12px;
  }
}
@media (min-width: 960px) {
  .projects-modal .content-container {
    height: 60vh;
  }
  .projects-modal .content-container.no-height {
    height: 0;
    padding-top: 0;
    padding-bottom: 0;
  }
  .projects-modal .content-container.fit-content {
    height: fit-content !important;
    height: -moz-fit-content !important;
  }
}
.projects-modal .content-container .no-device-placeholder {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  align-items: center;
}
.projects-modal .dt-table tbody.md-body > tr.md-row,
.projects-modal .dt-table .md-row-select tbody.md-body > tr.md-row {
  transition: background-color 0.2s;
  cursor: pointer;
}
.projects-modal .dt-table tbody.md-body > tr.md-row:first-child > td,
.projects-modal .dt-table .md-row-select tbody.md-body > tr.md-row:first-child > td {
  border-top-width: 0;
}
.projects-modal .dt-table tbody.md-body > tr.md-row.md-selected,
.projects-modal .dt-table .md-row-select tbody.md-body > tr.md-row.md-selected {
  background-color: rgba(255, 255, 255, 0.2);
}
.projects-modal .dt-table tbody.md-body > tr.md-row:focus,
.projects-modal .dt-table .md-row-select tbody.md-body > tr.md-row:focus {
  background-color: rgba(103, 159, 186, 0.2) !important;
}
.projects-modal .dt-table tbody.md-body > tr.md-row:not(.md-row-active):hover,
.projects-modal .dt-table .md-row-select tbody.md-body > tr.md-row:not(.md-row-active):hover {
  background-color: rgba(103, 159, 186, 0.2) !important;
}
.projects-modal .sensor-table > table {
  min-width: 0;
}
.projects-modal tr.md-row-active td {
  color: #fff !important;
}
.projects-modal .device-not-found {
  padding: 24px 0;
  text-align: center;
  opacity: 0.9;
}
.projects-modal .create-project-container {
  border-radius: 8px;
  background-color: rgb(246, 248, 250);
  border: 1px solid rgba(218, 220, 232, 0.8);
  margin-bottom: 32px;
}
@media (max-width: 735px) {
  .projects-modal .create-project-container {
    margin: 0 12px 12px 12px;
  }
}
.projects-modal .create-project-container .new-project-container {
  padding: 16px;
}
.projects-modal .create-project-container .new-project-container .error-message {
  color: #cf252b;
  font-size: 12px;
  margin: 4px 0 0 0;
}
.projects-modal .create-project-container .new-project-container .project-labels-section .label-item {
  margin-bottom: 8px;
}
.projects-modal .create-project-container .new-project-container .project-labels-section .label-item .label-display {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  background-color: rgba(218, 220, 232, 0.15);
  border-radius: 6px;
  border: 1px solid rgba(218, 220, 232, 0.3);
}
.projects-modal .create-project-container .new-project-container .project-labels-section .label-item .label-display .label-key {
  font-weight: 600;
  color: #17384c;
  margin-right: 4px;
}
.projects-modal .create-project-container .new-project-container .project-labels-section .label-item .label-display .label-separator {
  margin-right: 4px;
  opacity: 0.6;
}
.projects-modal .create-project-container .new-project-container .project-labels-section .label-item .label-display .label-value {
  flex: 1;
  opacity: 0.8;
}
.projects-modal .create-project-container .new-project-container .project-labels-section .label-item .label-display .label-value:empty::before {
  content: "None";
  opacity: 0.5;
  font-style: italic;
}
.projects-modal .create-project-container .new-project-container .project-labels-section .label-item .label-display .icon-button {
  margin-left: auto;
}
.projects-modal .create-project-container .new-project-container .project-labels-section .add-label-form {
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 8px;
  margin-bottom: 8px;
}
.projects-modal .create-project-container .new-project-container .project-labels-section .add-label-form .input-container {
  margin: 0;
}
.projects-modal .create-project-container .new-project-container .map-section {
  position: relative;
  height: 300px;
  margin-top: 8px;
  border-radius: 6px;
  overflow: hidden;
}
.projects-modal .create-project-container .new-project-container .map-section #create-project-map {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  border-radius: 6px;
}
.projects-modal .create-project-container .new-project-container .map-section .map-text-container {
  position: absolute;
  top: 0;
  left: 0;
  color: white;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  margin: 12px;
}
.projects-modal .create-project-container .new-project-container .map-section .map-text-container .map-text {
  margin: 0;
  padding: 6px 10px;
  font-weight: 600;
  background-color: rgba(40, 50, 60, 0.25);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.14);
  backdrop-filter: blur(2px);
  border-radius: 6px;
  line-height: 1.3em;
}
.projects-modal .create-project-container .new-project-container .map-section .map-clear-button-container {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 12px;
}
.projects-modal .create-project-container .new-project-container .map-section .map-clear-button-container .icon-button {
  background-color: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(4px);
  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.15);
}
.projects-modal .create-project-container .new-project-container .map-section .map-clear-button-container .icon-button .icon-button__text {
  color: #17384c;
}
.projects-modal .create-project-container .new-project-container .map-section .map-clear-button-container .icon-button .text-color-icon {
  fill: #17384c;
}
.projects-modal .create-project-container .new-project-container .map-section .mapboxgl-ctrl-geocoder {
  min-width: 200px;
}
.projects-modal .create-project-container .new-project-container .map-section .mapboxgl-ctrl-geocoder--input {
  outline: none;
}

.md-select-menu-container {
  z-index: 101;
}

.organization-modal {
  background-color: rgb(248, 248, 250);
  transition: all 0.2s ease-in-out;
}
@media (max-width: 1365px) {
  .organization-modal {
    height: 100%;
  }
}
@media (min-width: 960px) {
  .organization-modal {
    width: 80vw;
    max-width: 1000px;
    border: 0px;
    box-shadow: none;
  }
}
.organization-modal .modal-header {
  position: sticky;
  top: 0;
  background-color: #fff;
  border-bottom: 1px solid rgb(218, 220, 232);
  z-index: 2;
  padding: 36px;
  padding-top: 26px;
  padding-bottom: 26px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0px 2px 6px rgba(10, 20, 40, 0.05);
  display: flex;
  flex-direction: row;
}
@media (max-width: 735px) {
  .organization-modal .modal-header {
    padding: 12px;
  }
}
.organization-modal .modal-header .sub-heading {
  font-size: 14px;
  font-weight: 400;
  opacity: 0.8;
}
.organization-modal .content-container {
  transition: all 0.2s ease-in-out;
  padding: 36px;
  overflow: scroll;
  flex: 1 1 auto;
}
@media (max-width: 735px) {
  .organization-modal .content-container {
    padding: 12px;
  }
}
@media (min-width: 960px) {
  .organization-modal .content-container {
    height: 60vh;
  }
}
.organization-modal .content-container .no-access {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 45vh;
}
.organization-modal .content-container .no-access__text {
  font-size: 15px;
  opacity: 0.6;
}
.organization-modal .inactive-container {
  opacity: 0.4;
  pointer-events: none;
}
.organization-modal .dt-table tbody.md-body > tr.md-row,
.organization-modal .dt-table .md-row-select tbody.md-body > tr.md-row {
  transition: background-color 0.2s;
  cursor: default;
}

md-input-container.md-dark-theme label,
md-input-container.md-dark-theme .md-placeholder {
  color: #fff !important;
}

md-input-container.md-dark-theme label.md-required::after {
  color: rgb(238.2, 178.7, 180.8) !important;
}

md-input-container.md-dark-theme:not(.md-input-focused):not(.md-input-invalid) label.md-required::after {
  color: #fff;
}

.md-content.md-dark-theme {
  background-color: #17384c;
}

md-input-container.md-dark-theme.md-input-invalid .md-input {
  border-color: rgb(238.2, 178.7, 180.8) !important;
}

.md-dark-theme md-input-container.md-input-invalid .md-input-message-animation {
  color: rgb(238.2, 178.7, 180.8) !important;
}

md-input-container.md-dark-theme:not(.md-input-invalid).md-input-focused .md-input,
md-input-container.md-dark-theme:not(.md-input-invalid).md-input-resized .md-input {
  border-color: #fff !important;
}

/*# sourceMappingURL=app.df01eab8c8752815aed5.css.map*/