html, body {
  margin: 0;
  height: 100%;
}

body {
  position: relative;
  font-family: var(--main-font-name), sans-serif;
  font-size: var(--main-font-size);
  font-weight: var(--main-font-weight);
  color: var(--main-text-color);
  background-color: var(--main-background-color);
}

.simple-spinner {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 3px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  border-top-color: rgb(255, 255, 255);
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}
.server-connect-error-panel {
  position: relative;
  display: none;
  width: 100%;
  height: 100vh;
  justify-content: center;
  align-items: center;
  color: white;
  font-size: 3rem;
  background-color: rgb(0, 0, 0);
}

.server-connect-error-panel.show {
  display: flex;
}
.server-connect-error-panel.message .main-error-panel {
  display: none;
}
.server-connect-error-panel.spinner .network-error-panel {
  display: none;
}

.network-error-panel {
  position: absolute;
  top: 0;
  right: 0;
  padding: 1rem;
  border-radius: 1rem;
  background-color: #606060;
  margin: 2rem;
  z-index: 1000;
  border: white 0.2rem solid;
}

.main-error-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.main-error-panel .image {
  background-image: url(/ico-bootstrap/img/server-missing.png);
  width: 40rem;
  height: 20rem;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.main-error-panel .image.hidden {
  display: none;
}
.main-error-panel .loading {
  height: 10rem;
  display: flex;
  align-items: center;
}
.main-error-panel .description.hidden {
  display: none;
}

.system-error-panel {
  text-transform: none;
  font-family: sans-serif;
  font-size: 1rem;
  position: absolute;
  bottom: 2rem;
  right: 2rem;
}

img.cover {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.icon {
  filter: var(--main-icon-color);
  -webkit-filter: var(--main-icon-color);
}
.icon.original-color, .icon.svg {
  filter: none;
  -webkit-filter: none;
}

.ico-remote-action-notification-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.5rem;
  z-index: var(--interactive-tv-notification-z-index);
  background: var(--interactive-tv-notification-background-color);
  color: var(--interactive-tv-notification-color);
  font-size: 2rem;
  font-weight: bold;
  text-shadow: 0.2rem 0.2rem 0.2rem var(--tv-notification-shadow-color);
  display: none;
}
.ico-remote-action-notification-wrapper.show {
  display: block;
}

.page {
  width: 100%;
  height: 100%;
  margin: 0;
  border: 3rem solid transparent;
  box-sizing: border-box;
}
.page.card {
  margin: 0;
}

/*# sourceMappingURL=ico-bootstrap.css.map */