/*------------------------------*/
/* Brand resources */
/*------------------------------*/
:root {
  /*layout*/
  --body-font-size: 13px;
  --body-font-family: "Inter UI",Roboto,"Helvetica Neue",sans-serif;
  --body-background: #edf1f6;
  --body-background-image: none;
  --i4c-border-radius: 0px;
  --i4c-padding-sm: 5px;
  /*colors*/
  --i4c-brand-color: #f6512f;
  --i4c-accent-color: #eff1f6;
  --i4c-primary-color: #2978fe;
  --i4c-primary-color-action: #2978fe;
  --i4c-danger-color: #ff1100;
  --i4c-danger-color-action: #ff1100;
  --i4c-success-color: #31cca1;
  --i4c-success-color-action: #559000;
  --i4c-warning-color: #f9bd5f;
  --i4c-warning-color-action: #f9bd5f;
  --i4c-info-color: #29B6F6;
  --i4c-info-color-action: #8994a0;
  --i4c-yellow-color: #ecc546;
  --i4c-yellow-color-action: #ecc546;
  /*background*/
  --i4c-main-background: #ffffff;
  --i4c-secondary-background: #f6f6f6;
  --i4c-main-accent-background: #f6512f;
  --i4c-secondary-accent-background: #9f1313;
  --i4c-light-background: #e6e6e6;
  --i4c-lighter-background: #f2f2f2;
  --i4c-light-gray-background: #a1a1a1;
  --i4c-gray-background: #808080;
  --i4c-dark-background: #434343;
  --i4c-strong-background: #555555;
  --i4c-darker-background: #363636;
  --i4c-black-background: #000000;
  --i4c-white-background: #FFFFFF;
  /*foreground*/
  --i4c-body-text-color: #333333;
  --i4c-title-foreground: #282828;
  --i4c-subtitle-foreground: #808080;
  --i4c-small-foreground: #a1a1a1;
  --i4c-text-muted-foreground: #a1a1a1;
  --i4c-main-inverted-foreground: #ffffff;
  --i4c-secondary-inverted-foreground: #000;
  --i4c-main-accent-foreground: #ffffff;
  --i4c-secondary-accent-foreground: #ffffff;
  --i4c-light-inverted-foreground: #333333;
  --i4c-light-foreground: #a1a1a1;
  --i4c-light-border-color: #CCCCCC;
  --i4c-border-color: #111111;
  --i4c-light-subtitle-color: #e1e1e1;
  --i4c-text-variant-color: #363636;
  --i4c-highlight-color: #009C29;
  /*login*/
  --i4c-login-area-background: #FFFFFF;
  --i4c-login-header-background: #FFFFFF;
  --i4c-login-content-background: rgba(255, 255, 255, 0.4);
  --i4c-login-content-background-img: none;
  --i4c-login-content-border-color: #FFFFFF;
  --i4c-login-label-color: #565656;
  --i4c-login-input-background: #ffffff;
  --i4c-login-input-color: #565656;
  --i4c-product-logo-img: url(../images/viessmann-logo.png) no-repeat center center;
  --i4c-product-logo-title-color: #282828;
  --i4c-product-logo-title-font-size: 24px;
  --i4c-product-logo-title-font-weight: normal;
  --i4c-status-message-color: #565656;
  --i4c-login-footer-background: rgba(255, 255, 255, 0.75);
  --i4c-login-footer-background-img: none;
  --i4c-login-footer-color: #565656;
  --i4c-login-footer-border-color: #565656;
  --i4c-login-footer-button-color: #565656;
  --i4c-login-footer-button-expanded-background-img: none;
  --i4c-login-footer-button-expanded-background: #F6F6F6;
  --i4c-main-footer-logo: transparent url(../images/login-footer-logo.png) no-repeat center;
  --i4c-main-footer-logo-size: 225px;
  /*side-nav*/
  --i4c-side-nav-background: #ffffff;
  --i4c-side-nav-brand-logo: url(../images/navbar_logo_i4.svg);
  --i4c-nav-brand-background: #f6512f;
  --i4c-nav-brand-background-hover: #FFFFFF;
  --i4c-side-nav-li-border-bottom: #dcdcdc;
  --i4c-side-nav-li-border-bottom-hover: #dcdcdc;
  --i4c-side-nav-a-background: #ffffff;
  --i4c-side-nav-a-foreground: #767b91;
  --i4c-side-nav-a-background-active: #ffffff;
  --i4c-side-nav-a-icon-active: #ff3e17;
  --i4c-side-nav-a-foreground-active: rgb(42, 50, 75);
  --i4c-side-nav-a-background-hover: #f6f6f6;
  --i4c-side-nav-a-foreground-hover: #2A324B;
  --i4c-side-nav-icon-size: 32px;
  /*header*/
  --i4c-header-background: #ff3e17;
  --i4c-header-foreground: #FFFFFF;
  --i4c-header-subtitle: #92a9b8;
  --i4c-header-item-background: #ff3e17;
  --i4c-header-item-foreground: #FFFFFF;
  --i4c-header-item-background-active: #ff3e16;
  --i4c-header-item-icon-active: #FFFFFF;
  --i4c-header-item-foreground-active: #FFFFFF;
  /*panels*/
  --i4c-panel-border-color: #dddddd;
  --i4c-panel-background-image: none;
  --i4c-panel-body-background: #FFFFFF;
  --i4c-panel-footer-background: #fefefe;
  --i4c-panel-header-background: #ffffff;
  --i4c-panel-header-control: #565656;
  --i4c-panel-header-control-hover: #093b9d;
  --i4c-panel-title-color: #2a324b;
  --i4c-panel-title-font-weight: bold;
  --i4c-panel-subtitle-color: #2a324b;
  --i4c-panel-toolbar-background: #FFFFFF;
  --i4c-panel-toolbar-icon: #2979ff;
  --i4c-panel-toolbar-item-background: #ffffff;
  --i4c-panel-toolbar-item-foreground: #2979ff;
  --i4c-panel-toolbar-item-border-color: #ffffff;
  --i4c-panel-toolbar-item-background-hover: #f8f9ff;
  --i4c-panel-toolbar-item-foreground-hover: #093b9d;
  --i4c-panel-toolbar-item-background-active: #f8f9ff;
  --i4c-panel-toolbar-item-foreground-active: #093b9d;
  --i4c-panel-box-shadow: none;
  --i4c-panel-header-variant: #666666;
  --i4c-panel-header-variant-subtitle: #C2C2C2;
  --i4c-panel-header-variant-control: #f2f2f2;
  /*tiles*/
  --i4c-tile-border-color: #ddd;
  --i4c-tile-background-color: #FFFFFF;
  --i4c-tile-title-color: #2A324B;
  --i4c-tile-subtitle-color: #565656;
  --i4c-tile-icon-color: #565656;
  --i4c-tile-title-size: 13px;
  --i4c-tile-icon-size: 24px;
  --i4c-tile-background-color-disabled: #F6f6f6;
  --i4c-tile-foreground-color-disabled: #808080;
  /*-*/
  --i4c-tile-c-background-color-hover: #f6f6f6;
  --i4c-tile-c-icon-color-hover: #565656;
  --i4c-tile-c-title-color-hover: #434343;
  --i4c-tile-c-subtitle-color-hover: #434343;
  --i4c-tile-c-background-color-active: #ffffff;
  --i4c-tile-c-title-color-active: #2A324B;
  --i4c-tile-c-subtitle-color-active: #2A324B;
  --i4c-tile-c-icon-color-active: #565656;
  /*-*/
  --i4c-tile-c-background-color-active-hover: #ffffff;
  --i4c-tile-c-title-color-active-hover: #2A324B;
  --i4c-tile-c-subtitle-color-active-hover: #2A324B;
  --i4c-tile-c-icon-color-active-hover: #2A324B;
  /*panel tiles*/
  --i4c-tile-content-background-color: #FFFFFF;
  --i4c-tile-content-icon-color: #565656;
  --i4c-tile-content-value-color: #565656;
  --i4c-tile-content-subtitle-color: #565656;
  --i4c-tile-content-title-size: 13px;
  --i4c-tile-content-icon-size: 24px;
  /*-*/
  --i4c-tile-content-background-hover: #f6f6f6;
  --i4c-tile-content-icon-color-hover: #565656;
  --i4c-tile-content-value-color-hover: #565656;
  --i4c-tile-content-subtitle-color-hover: #565656;
  /*-*/
  --i4c-tile-content-background-active: #ffffff;
  --i4c-tile-content-icon-color-active: #2A324B;
  --i4c-tile-content-value-color-active: #2A324B;
  --i4c-tile-content-active-title-color: #2A324B;
  --i4c-tile-content-subtitle-color-active: #2A324B;
  /*-*/
  --i4c-tile-content-background-active-hover: #FAFAFA;
  --i4c-tile-content-icon-color-active-hover: #2A324B;
  --i4c-tile-content-value-color-active-hover: #2A324B;
  --i4c-tile-content-subtitle-color-active-hover: #2A324B;
  /*buttons*/
  --i4c-button-background: #ffffff;
  --i4c-button-foreground: #2A324B;
  --i4c-button-border-color: #CCCCCC;
  --i4c-button-default-background-hover: #eff1f6;
  --i4c-button-default-foreground-hover: #093b9d;
  --i4c-button-default-background-active: #f8f9ff;
  --i4c-button-default-foreground-active: #093b9d;
  --i4c-button-default-background-focus: #F6F6F6;
  --i4c-button-default-foreground-focus: #f6512f;
  --i4c-button-default-background-disabled: #f2f2f2;
  --i4c-button-default-foreground-disabled: #565656;
  --i4c-button-highlighted-background: #f2f2f2;
  --i4c-button-highlighted-foreground: #2978fe;
  --i4c-button-highlighted-background-active: #ecf1f6;
  --i4c-button-highlighted-foreground-active: #043b9d;
  /*-*/
  --i4c-button-link-accent-background: #FFFFFF;
  --i4c-button-link-accent-foreground: #f6512f;
  --i4c-button-link-accent-background-active: #f8f9ff;
  --i4c-button-link-accent-foreground-active: #093b9d;
  /*-*/
  --i4c-button-circle-background: #ffffff;
  --i4c-button-circle-foreground: #2978fe;
  --i4c-button-circle-border-color: #ffffff;
  --i4c-button-circle-background-hover: #f8f9ff;
  --i4c-button-circle-foreground-hover: #093b9d;
  --i4c-button-circle-border-color-hover: #f6512f;
  /*-*/
  --i4c-button-success-background: #31cca1;
  --i4c-button-success-foreground: #ffffff;
  --i4c-button-success-border-color: #31cca1;
  --i4c-button-success-background-hover: #449d44;
  --i4c-button-success-foreground-hover: #ffffff;
  --i4c-button-success-border-color-hover: #398439;
  --i4c-button-success-background-disabled: #28a745;
  --i4c-button-success-border-color-disabled: #28a745;
  /*-*/
  --i4c-button-variant-background: #FFFFFF;
  --i4c-button-variant-foreground: #565656;
  --i4c-button-variant-border-color: #ffffff;
  --i4c-button-variant-background-active: #eff1f6;
  --i4c-button-variant-foreground-active: #2978fe;
  --i4c-button-variant-border-color-active: #eff1f6;
  --i4c-button-variant-background-disabled: #6c757d;
  --i4c-button-variant-border-color-disabled: #6c757d;
  /*-*/
  --i4c-button-highlighted-accent-background: #ffffff;
  --i4c-button-highlighted-accent-foreground: #073b9d;
  --i4c-button-highlighted-accent-border-color: #CCCCCC;
  --i4c-button-highlighted-accent-background-active: #ecf1f6;
  --i4c-button-highlighted-accent-foreground-active: #073b9d;
  --i4c-button-highlighted-accent-border-color-active: #555555;
  /*-*/
  --i4c-button-accent-background: #ffffff;
  --i4c-button-accent-foreground: #2978fe;
  --i4c-button-accent-border-color: #cccccc;
  --i4c-button-accent-background-focus: #f8f9ff;
  --i4c-button-accent-foreground-focus: #093b9d;
  --i4c-button-accent-border-color-focus: #bfbfbf;
  --i4c-button-accent-background-active: #f8f9ff;
  --i4c-button-accent-foreground-active: #093b9d;
  --i4c-button-accent-border-color-active: #f6512f;
  --i4c-button-accent-background-disabled: #a1a1a1;
  --i4c-button-accent-foreground-disabled: #FFFFFF;
  /*buttons content*/
  --i4c-button-subtitle-foreground: #a1a1a1;
  --i4c-button-title-foreground-hover: #093b9d;
  --i4c-button-icon-color-hover: #073b9d;
  --i4c-button-subtitle-foreground-active-hover: #f2f2f2;
  --i4c-button-icon-color-active-hover: #073b9d;
  /*kpi*/
  --i4c-kpi-clickable-foreground: #333333;
  --i4c-kpi-clickable-background: #ecf1f6;
  --i4c-kpi-clickable-border-left: #ecf1f6;
  --i4c-kpi-clickable-foreground-hover: #333333;
  --i4c-kpi-clickable-background-hover: #ecf1f6;
  --i4c-kpi-clickable-border-left-hover: #ffffff;
  --i4c-consumption-type-icon-color: #434343;
  --i4c-consumption-type-icon-font-size: 18px;
  --i4c-consumption-type-name-color: #434343;
  --i4c-consumption-type-name-font-size: 16px;
  --i4c-consumption-type-value-font-size: 32px;
  --i4c-consumption-type-unit-color: #a1a1a1;
  /*calendar*/
  --i4c-cal-cell-foreground: #333333;
  --i4c-cal-cell-background: #ffffff;
  --i4c-cal-cell-foreground-hover: #565656;
  --i4c-cal-cell-background-hover: #ededed;
  --i4c-cal-cell-border-color: #c2c2c2;
  --i4c-cal-weekend-foreground: #CF252C;
  --i4c-cal-week-box-foreground: #FFFFFF;
  --i4c-cal-week-box-background: #f6512f;
  --i4c-cal-week-box-border-color: #f6512f;
  --i4c-cal-today-foreground: #2979ff;
  --i4c-cal-today-background: #fbfbfb;
  /*map*/
  --i4c-map-cluster-sm-background: rgba(118, 175, 42, 0.6);
  --i4c-map-cluster-sm-foreground: #FFFFFF;
  --i4c-map-cluster-md-background: rgba(255, 135, 31, 0.6);
  --i4c-map-cluster-md-foreground: #FFFFFF;
  --i4c-map-cluster-lg-background: rgba(219, 8, 8, 0.6);
  --i4c-map-cluster-lg-foreground: #FFFFFF;
  /*load profile*/
  --i4c-load-profile-filter-background: #ffffff;
  --i4c-load-profile-filter-footer: #fafafa;
  --i4c-load-profile-filter-search-background: #fafafa;
  /*forms*/
  --i4c-form-control-validation-indicator: #CF252C;
  --i4c-list-group-item-background: #FFFFFF;
  --i4c-list-group-item-foreground: #565656;
  --i4c-list-group-item-background-hover: #eff1f6;
  --i4c-list-group-item-foreground-hover: #363636;
  --i4c-list-group-item-background-selected-hover: #eff1f6;
  --i4c-list-group-item-foreground-selected-hover: #363636;
  --i4c-list-group-item-background-active: #eff1f6;
  --i4c-list-group-item-foreground-active: #333333;
  /*charts*/
  --i4c-chart-title-color: #666666;
  --i4c-chart-title-unit-color: #9d9da5;
  --i4c-chart-title-i-font-size: 18px;
  --i4c-axis-x-label-fill: #9d9da5;
  --i4c-chart-tooltip-header-background: #363636;
  --i4c-chart-tooltip-header-foreground: #FFFFFF;
  --i4c-chart-tooltip-header-background-img: none;
  --i4c-chart-ticks-color: #a1a1a9;
  --i4c-chart-max-line-color: #CF252C;
  --i4c-chart-min-line-color: #009C29;
  --i4c-chart-avg-line-color: #363636;
  --i4c-measure-item-foreground: #FFFFFF;
  --i4c-measure-item-background: #ff3e16; }

.wf-login-area {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  height: 100%;
  overflow-y: auto;
  position: relative;
  background: var(--i4c-login-area-background); }

.wf-login-header {
  background-color: #ff3e15;
  height: 72px;
  overflow: visible;
  text-align: center;
  position: fixed;
  left: 0;
  right: 0; }

.wf-login-header:before {
  content: "Login";
  float: left;
  line-height: 72px;
  color: #ffffff;
  margin-left: 24px;
  font-size: 20px; }

.wf-secondary-login-button, .wf-customer-version, .wf-login-contact {
  display: none; }

.wf-login-icon:before {
  content: "\e6de";
  font-size: 24px; }

.wf-login-content {
  padding: 30px 20px;
  background-color: var(--i4c-login-content-background);
  background-image: var(--i4c-login-content-background-img);
  margin: 0 -15px;
  border-top: 1px solid var(--i4c-login-content-border-color);
  border-bottom: 1px solid var(--i4c-login-content-border-color); }

#loginForm,
#socialLoginForm {
  max-width: 550px;
  margin: 0 auto; }

#socialLoginForm {
  display: flex;
  flex-direction: row;
  justify-content: left;
  align-items: center;
  position: absolute;
  top: 0; }

#socialLoginForm a {
  text-align: left;
  color: #06a6fe; }

#socialLoginForm a:hover {
  background: #fff;
  border-color: #fff;
  color: #06a6fe;
  box-shadow: none; }

.wf-login-buttons-container button {
  border: 1px solid #06a6fe; }

.wf-login-buttons-container button:hover, .wf-login-buttons-container a:hover {
  color: #ffffff;
  background: #06a6fe;
  border-color: #06a6fe; }

.wf-main-login .form-group {
  display: flex;
  flex-direction: column;
  width: 100%;
  justify-content: center;
  margin: 0; }

.wf-login-content .control-label {
  color: rgba(0, 0, 0, 0.26);
  font-weight: normal;
  text-align: left;
  padding-bottom: 5px;
  padding-top: 15px;
  font-size: 24px;
  white-space: nowrap; }

.wf-primary-login-button:focus,
.wf-primary-login-button {
  background: #03a6ff;
  color: var(--i4c-main-inverted-foreground);
  float: right;
  width: auto;
  border-radius: 5px;
  padding: 5px 10px;
  font-size: 18px;
  box-shadow: 0 1px 2px #00000069; }

/*temp css to force restyling the form -- to be removed*/
.wf-login-content .col-sm-9 {
  width: 100%; }

.col-sm-push-3 {
  left: 0; }

/*temp css to force restyling the form -- to be removed*/
select.form-control {
  cursor: pointer; }

.wf-login-content .dropdown {
  border: none;
  box-shadow: none; }

.wf-login-content .selectpicker,
.wf-login-content .dropdown-toggle,
.wf-login-content input[type="text"],
.wf-login-content input:-webkit-autofill,
.wf-login-content input[type="password"] {
  border-radius: var(--i4c-border-radius);
  border: none;
  border-bottom: 1px solid #dddddd;
  box-shadow: none;
  margin-bottom: 15px;
  background: transparent;
  transition: 0.2s; }

.wf-login-content .open > .dropdown-toggle.btn-default:hover,
.wf-login-content .dropdown-toggle:focus,
.wf-login-content input[type="text"]:focus,
.wf-login-content input:-webkit-autofill:focus,
.wf-login-content input[type="password"]:focus {
  z-index: 1;
  background: white;
  border: none;
  border-bottom: 2px solid #06a6fe; }

.wf-login-content .dropdown-menu > .active > a {
  background: #06a6fe; }

.wf-login-buttons-container {
  margin-top: 50px; }

.status-message {
  color: var(--i4c-status-message-color);
  margin-top: 50px;
  text-align: right; }

.wf-product-logo {
  background: var(--i4c-product-logo-img);
  text-align: center;
  background-size: 260px;
  margin: 200px auto 10px auto;
  height: 80px;
  -moz-animation-delay: 0.5s;
  -o-animation-delay: 0.5s;
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
  -moz-animation-duration: 1s;
  -o-animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s; }

.wf-product-logo:before {
  content: " ";
  top: 40px;
  position: absolute;
  color: var(--i4c-product-logo-title-color);
  left: 0;
  right: 0;
  font-weight: var(--i4c-product-logo-title-font-weight);
  font-size: var(--i4c-product-logo-title-font-size); }

.wf-product-title, .wf-product-subtitle, .wf-social-login {
  display: none; }

.wf-login-version {
  font-size: 12px;
  padding: 20px; }

.wf-login-footer-toggle-btn {
  border-radius: 3px 3px 0 0;
  border-bottom: none;
  color: var(--i4c-login-footer-button-color); }

.wf-login-footer-toggle-btn[aria-expanded="true"] {
  background-image: var(--i4c-login-footer-button-expanded-background-img);
  background: var(--i4c-login-footer-button-expanded-background); }

.wf-login-footer-toggle-btn[aria-expanded="true"] i {
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg); }

.wf-main-login-footer-logo {
  height: 60px;
  width: 100%;
  background: var(--i4c-main-footer-logo);
  background-size: var(--i4c-main-footer-logo-size); }

#wf-login-footer {
  background-color: var(--i4c-login-footer-background);
  bottom: 0;
  width: 100%;
  line-height: 30px;
  border-top: 1px solid var(--i4c-login-footer-border-color);
  background-image: var(--i4c-login-footer-background-img);
  color: var(--i4c-login-footer-color); }

#wf-login-footer > .container {
  padding: 20px 0; }

#wf-login-footer a {
  color: var(--i4c-accent-color); }

#wf-login-footer .fa {
  margin: 0 5px; }

.validation-summary-errors {
  text-align: center; }

.validation-summary-errors ul {
  list-style-type: none;
  margin-bottom: 0; }

@media (max-width: 768px) {
  .wf-login-logo {
    display: none; }
  .wf-product-logo {
    margin: 20px 0;
    margin-top: 70px; } }

@media (max-height: 790px) {
  .wf-login-logo {
    width: 100px;
    height: 100px; } }

@media (max-height: 650px) {
  .wf-login-logo {
    display: none; } }

/* removable login area if customer asks*/
/*#loginForm .login-user-input, 
#loginForm .login-pass-input, 
#loginForm .wf-login-language-dropdown {
    display: none;
}

.wf-product-logo {
    margin-top: 30%;
}

#socialLoginForm a {
    background: #06a6fe;
    color: #fff;
    padding: 9px;
    border-radius: 5px;
    box-shadow: 0 1px 2px #00000069;
    border-color: #06a6fe;
    margin-right: 30px;
}

    #socialLoginForm a:hover {
        background: #06a6fe;
        color: #fff;
        box-shadow: 0 1px 2px #00000069;
        border-color: #06a6fe;
    }

.wf-login-buttons-container button {
    border: 1px solid #06a6fe;
    font-size: 14px;
    display: flex;
    align-items: center;
    padding: 7px;
}*/
/* removable login area */

/* Slash Screen Styles */
.splash {
  background: var(--i4c-main-background);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center; }

.splash-customer-logo {
  /*background: url(../images/splash_logo.svg) no-repeat center center;*/
  background: none;
  background-size: contain;
  width: 200px;
  height: 200px;
  margin: 30px auto 20px auto; }

.wf-customer-title,
.splash-customer-title {
  display: none; }

.splash-product-title > svg {
  display: none; }

.splash-product-title {
  width: 380px;
  height: 80px;
  background: var(--i4c-product-logo-img);
  margin: 200px auto 50px auto;
  background-size: contain; }

.splash-loading-indicator-container {
  margin: 100px auto;
  position: relative;
  width: 6em;
  height: 6em; }

.splash-loading-indicator-container:after {
  content: "Welcome to Viscada!";
  font-weight: normal;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  letter-spacing: 8px;
  font-size: 20px;
  top: -75px;
  animation: fadeIn 5s;
  color: #000;
  white-space: nowrap; }

.splash-loading-indicator-element {
  margin: 3em auto;
  font-size: 12px;
  position: relative;
  text-indent: -9999em;
  border: 2px solid #ffffff00;
  border-left: 2px solid #03a6ff;
  -webkit-animation: spinner_animation 1.1s infinite linear;
  -moz-animation: spinner_animation 1.1s infinite linear;
  -o-animation: spinner_animation 1.1s infinite linear;
  -ms-animation: spinner_animation 1.1s infinite linear;
  animation: spinner_animation 2s infinite linear; }

.splash-loading-indicator-element,
.splash-loading-indicator-element:after {
  -ms-border-radius: 50%;
  border-radius: 50%;
  width: 6em;
  height: 6em; }

/* Brand Specific Layout Modifications for the VISCADA Brand */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format("woff2"); }

@font-face {
  font-family: 'Inter UI';
  font-style: normal;
  font-weight: 400;
  src: url(https://rsms.me/inter/font-files/Inter-Regular.woff2?v=3.18) format("woff2"); }

.wf-shell-header-primary:first-child::before {
  display: block;
  min-width: 172px;
  height: 20px;
  margin-top: 22px;
  background: url(../images/viscada.png);
  content: " ";
  background-size: contain;
  background-repeat: no-repeat; }

.wf-shell-header-primary {
  justify-content: left;
  height: 40px;
  width: 300px;
  font-family: "Inter UI", Roboto, "Helvetica Neue", sans-serif;
  font-size: 16px;
  line-height: 64px;
  font-stretch: 100%;
  font-style: normal;
  font-weight: 500;
  color: #fff;
  white-space: nowrap; }

.wf-shell-header-secondary .wf-shell-header-items {
  top: 64px; }

.wf-shell-header-item i {
  display: flex; }

.wf-shell-header-items .wf-notificationText {
  font-size: initial; }

.wf-shell .wf-shell-header {
  height: 64px !important;
  padding-left: 65px; }

.wf-shell #shell-content {
  padding-top: 69px !important; }

/* --- Side Nav --- */
#sideNavCollapse {
  position: fixed;
  top: 10px !important;
  left: 16px;
  z-index: -1;
  display: block !important;
  height: 40px !important;
  width: 40px !important;
  cursor: pointer;
  pointer-events: all; }

.collapse-nav-button {
  position: fixed;
  z-index: 1;
  width: 65px;
  height: 64px !important;
  padding-left: 24px !important;
  padding-top: 16px !important;
  background-color: var(--i4c-header-background);
  font-family: 'Material Icons' !important;
  font-size: 24px !important;
  color: var(--i4c-header-foreground);
  pointer-events: none; }

.collapse-nav-button:before {
  content: "menu"; }

.side-bar {
  position: relative;
  float: left;
  width: auto;
  background: transparent;
  box-shadow: none !important; }

.navbar-brand-logo {
  display: none; }

.side-nav {
  padding-top: 0px;
  height: calc(100% - var(--logo-height));
  overflow: hidden scroll;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */ }

.side-nav::-webkit-scrollbar {
  display: none; }

.side-nav__item {
  border-bottom-color: #ffffff !important; }

.side-nav__item-content {
  display: flex;
  align-content: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 90px;
  padding: 10px 5px; }

.side-nav__item.active .side-nav__item-content {
  border-right: 1px solid var(--i4c-primary-color); }

.wf-shell-header-item.wf-alarmMonitor .label {
  font-size: 14px;
  padding: 0;
  background: transparent !important; }

#sideNavCollapse:checked ~ .side-bar__scrollarea {
  width: 0;
  overflow-X: hidden;
  transition: 0.2s; }

#sideNavCollapse:checked ~ .shell-content-wrapper {
  margin: 0;
  transition: 0.2s; }

.side-bar__scrollarea {
  --primary-header-height: 64px;
  background: white;
  width: 130px;
  margin-top: var(--primary-header-height);
  transition: 0.2s; }

.side-bar__scrollarea:before {
  position: absolute;
  right: 1px;
  height: 100%;
  width: 15px;
  background: #FFFFFF; }

.side-nav__item:hover {
  background-color: var(--i4c-side-nav-a-background-hover); }

.side-nav__item--add-page-btn .side-nav__item-content {
  color: #FFFFFF; }

.side-nav__item--add-page-btn .fa-plus {
  font-size: var(--i4c-side-nav-icon-size); }

.side-nav__page-edit-icon {
  font-size: calc(var(--i4c-side-nav-icon-size) * .8); }

/* --- Content Shell  --- */
#shell-content-wrapper {
  position: relative;
  float: initial;
  margin: auto; }

iframe .wf-panel-body {
  background-color: #fff; }

.edit-mode .wf-panel {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1); }

.wf-panel-head {
  height: 48px;
  border-bottom: 1px solid #dddddd;
  box-shadow: 0px 0px 5px #dddddd; }

.wf-panel-head-control:has(.wf-small-x) {
  --size: 24px;
  font-family: "material icons";
  border-radius: 50%;
  font-size: 20px;
  line-height: 22px;
  /* vertical-align: bottom; */ }

.wf-panel-head-control:has(.wf-small-x):hover {
  background-color: #dedede80; }

/* .wf-small-x:before {
    content: "close";
} */
.wf-tile-body:hover {
  background-color: #fafafa; }

.wf-tile-title {
  padding-top: 0px;
  line-height: 20px; }

/*elevated elemente!*/
.wf-kpi-clickable-link:before {
  display: none; }

.wf-kpi-clickable {
  border: 1px solid white;
  margin-right: 15px;
  min-width: calc(50% - 20px) !important; }

.wf-kpi-clickable:hover {
  border: 1px solid #2979ff;
  box-shadow: none;
  margin-right: 15px;
  min-width: calc(50% - 20px) !important; }

.wf-components-group-item.selectable.selected:hover,
.wf-components-group-item.selectable:hover {
  border-color: #2978fe; }

search-results,
measure-aggregation-button,
selectable-signal-button,
selectable-device-button {
  --border: white;
  --border-active: #06a6fe;
  --border-hover: var(--i4c-primary-color-action);
  --border-selected-hover: var(--i4c-primary-color-action); }

.list-group-item {
  margin-bottom: 0px;
  border-color: white; }

.btn-group > .btn-default:first-child {
  margin-right: 1px; }

.wf-components-group-item.selectable:hover .wf-title {
  color: inherit; }

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  border-color: #06a6fe; }

.wf-tile-clickable .wf-tile-icon,
.wf-tile-clickable:hover .wf-tile-icon {
  color: var(--i4c-tile-icon-color); }

.wf-tile-clickable .wf-tile-icon:before {
  position: absolute;
  bottom: 5px;
  right: 10px;
  left: 10px;
  content: " ";
  height: 1px;
  font-size: 8px; }

.wf-tile-active .wf-tile-body:before,
.wf-tile-active .wf-tile-body:after {
  display: none; }

.wf-tile-active:after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 1px;
  content: "\e6a5";
  content: " ";
  background: #2978fe;
  color: #2978fe;
  font-family: wfIconFont;
  font-size: 16px; }

selectable-button .fa-2x {
  font-size: 14px; }

.wf-alarm-table tr:hover:not(:first-child) {
  border-left: none; }

.btn-block + .btn-block {
  margin-right: 5px;
  margin-top: 0px; }

.wf-tile-icon {
  color: var(--i4c-tile-icon-color) !important; }

.btn-default:focus,
.btn-default.focus {
  border-color: #bfbfbf; }

.wf-controlbar .btn-default {
  color: var(--i4c-button-circle-foreground); }

.wf-controlbar .btn-default:focus {
  color: var(--i4c-button-circle-foreground-hover); }

.wf-operationMonitor .dropdown-menu {
  width: auto; }

.wf-connectionMonitor .list-group-item {
  line-height: initial; }

.site-selector-actionbar button {
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 5px;
  font-size: 32px; }

.app-preview-frame {
  top: 0px;
  height: 100%; }

.btn-default .badge {
  background-color: #c7ccdb;
  border-radius: 2px;
  color: rgba(255, 255, 255, 0.87);
  font-size: 12px;
  font-weight: normal;
  padding: 3px 8px 2px;
  text-align: center; }

.wf-busy-indicator-element,
.wf-loading-indicator-element {
  --border-color-active: #68b4ff; }

.wf-loading-indicator-5x .wf-loading-indicator-icon {
  --color-active: #68b4ff; }

.wf-breadcrumb,
.wf-breadcrumb {
  --background-color: var(--i4c-lighter-background);
  --border-color: var(--i4c-button-default-background-active);
  --foreground: #333; }

button:hover .wf-btn-subtitle,
.btn:hover .wf-btn-subtitle {
  color: inherit; }

/*# sourceMappingURL=VISCADA.bundle.css.map */

a[title='Help'] {
    display:none;
}

a[title='Print'] {
    display:none;
}

a[title='Hilfe'] {
    display:none;
}

a[title='Drucken'] {
    display:none;
}