html {
  position: relative;
  min-height: 100%;
}
body {
  height: 100%;
  background-color: floralwhite;
}
/*
 * --- Docs related stuff ---
 */
.bg-white {
  background-color: white;
}
.b-info {
  background-color: #5bc0de;
}
.b-warning {
  background-color: #f0ad4e;
}
.b-danger {
  background-color: #d9534f;
}
.b-success {
  background-color: #5cb85c;
}
.b-primary {
  background-color: #3c3c3c;
}
.b-default {
  background-color: #777;
}
.jumbotron-floralwhite {
  background-color: floralwhite;
  background-image: -webkit-linear-gradient(top,#fffaf0 40%, #ffebcd 100%);
  background-image: -o-linear-gradient(top,#fffaf0 40%, #ffebcd 100%);
  background-image: -webkit-gradient(linear,left top,left bottom,from(#fffaf0),to(#ffebcd));
  background-image: linear-gradient(to bottom,#fffaf0 40%, #ffebcd 100%);
  color: #270101;
  /* Margin for top navbar, which has margin-bottom: 20 px what is needed
  in pages without jumbotron. Here it makes jumobotron sticked to navbar
  without additional space.*/
  margin-top: -20px;
}
/* docs sidebar */
.bs-docs-sidebar {
  position: sticky;
  top: 20px;
  margin-top: 20px;
}
.bs-docs-sidebar > nav {
  padding-left: 20px;
}
/* All levels of nav */
.bs-docs-sidebar .nav > li > a {
  display: block;
  padding: 4px 20px;
  font-size: 13px;
  /*font-weight: 500;*/
  color: #5f5f5f;
}
.bs-docs-sidebar .nav > li > a:hover,
.bs-docs-sidebar .nav > li > a:focus {
  padding-left: 19px;
  color: #800303;
  text-decoration: none;
  background-color: transparent;
  border-left: 1px solid #800303;
}
.bs-docs-sidebar .nav > .active > a,
.bs-docs-sidebar .nav > .active:hover > a,
.bs-docs-sidebar .nav > .active:focus > a {
  padding-left: 18px;
  font-weight: bold;
  color: #800303;
  background-color: transparent;
  border-left: 2px solid #800303;
}
/* Nav: second level (shown on .active) */
.bs-docs-sidebar .nav .nav {
  display: none;
  /* Hide by default, but at >768px, show it */
  padding-bottom: 10px;
}
.bs-docs-sidebar .nav > .active > .nav {
  display: block;
}
.bs-docs-sidebar .nav .nav > li > a {
  padding-top: 1px;
  padding-bottom: 1px;
  padding-left: 30px;
  font-size: 12px;
  font-weight: normal;
}
.bs-docs-sidebar .nav .nav > li > a:hover,
.bs-docs-sidebar .nav .nav > li > a:focus {
  padding-left: 29px;
}
.bs-docs-sidebar .nav .nav > .active > a,
.bs-docs-sidebar .nav .nav > .active:hover > a,
.bs-docs-sidebar .nav .nav > .active:focus > a {
  padding-left: 28px;
  font-weight: 500;
}
/* Back to top (hidden on mobile) */
.back-to-top {
  display: none;
  padding: 4px 10px;
  margin-top: 10px;
  margin-left: 10px;
  font-size: 13px;
  /*font-weight: 500;*/
  color: #999;
}
.back-to-top:hover {
  color: #800303;
  text-decoration: none;
}
@media (min-width: 768px) {
  .back-to-top {
    display: block;
  }
}
.link-primary {
  font-weight: bold;
  color: #524949;
}
.link-primary:hover {
  color: #6f4a2b;
}
.docs-link {
  font-weight: bold;
  color: #800303;
}
.docs-link:hover {
  color: #b40000;
}
/* Space things out */
.bs-docs-section {
  margin-bottom: 60px;
}
.bs-docs-section h1[id] {
  padding-top: 20px;
  margin-top: 0;
}
.bs-docs-section .well {
  border-left: 4px solid;
  border-radius: 4px;
  background: inherit;
  padding: 15px 19px;
}
.well-success {
  border-color: #28a745 !important;
  /* #b2dba1 !important;  */
}
.well-info {
  /* border-color: #a94442 !important; */
  border-color: #17a2b8 !important;
}
.well-warning {
  border-color: #ffc107 !important;
  /* #f5e79e !important; */
}
.well-danger {
  border-color: #dc3545 !important;
}
.bs-docs-section .well :first-child, .bs-docs-section .alert :first-child {
  margin-top: 0;
}
.bs-docs-section .well :last-child, .bs-docs-section .alert :last-child {
  margin-bottom: 0;
}
/*
 * --- Modifications for footer ---
 */
body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  /* background-color: #f7f7f7; */
  background-image: -webkit-linear-gradient(top, #3c3c3c 0, #222 100%);
  background-image: -o-linear-gradient(top, #3c3c3c 0, #222 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #3c3c3c), to(#222));
  background-image: linear-gradient(to bottom, #3c3c3c 0, #222 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.footer-content {
  padding: 15px 0px;
  color: blanchedalmond;
}
.footer-content a, .footer-content span {
  color: blanchedalmond;
  margin: 0px 10px;
}
.language-box {
  text-align: right;
}
.language-box button.active {
  cursor: default;
}
@media (max-width: 767px) {
  body {
    margin-bottom: 100px;
  }
  .footer {
    height: 100px;
  }
  .language-box {
    margin-top: 10px;
    text-align: initial;
  }
}
/*
 * --- Login/register panel ---
 */
.form-signin {
  max-width: 360px;
  margin: 100px auto;
}
.form-signin .panel-heading > .panel-title {
 font-size: 20px;
 padding: 5px 0px;
 text-align: center;
}
.form-signin .panel-footer {
  background-color: initial;
}
.form-signin .form-control:focus {
  z-index: 2;
}
/*
 * --- Navbar brand ---
 */
.navbar-brand {
  padding: 9px 15px;
}
/*
 * --- Fixes ---
 */
/* Fix to fit all new navs. */
@media (max-width: 991px) {
  .nav>li>a {
    padding-left: 8px;
    padding-right: 8px;
  }
}
@media (max-width: 767px) {
  .nav>li>a {
    padding-left: 15px;
    padding-right: 15px;
  }
}
/*Fix for table header to display icons in one line*/
@media (max-width: 991px) {
  .inline-flex {
    display: inline-flex;
  }
}
@media (max-width: 767px) {
  .inline-flex {
    display: initial;
  }
}
/*Minicolors fix in table-responsive so its div isnt cut off*/
.minicolors-theme-bootstrap input.full-width + .minicolors-swatch {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 4px;
  cursor: pointer;
}
/* Site message */
.site-message {
  /* Pull 20px up to touch navbar and add same space after */
  margin-top: -20px;
  margin-bottom: 20px;
  padding-top: 10px;
}
/*
 * --- Helper classes ---
 */
.user-select-all {
  user-select: all;
}
.user-select-none {
  user-select: none;
}
.break-word {
  word-wrap: break-word;
  word-break: break-word;
}
.truncate, .text-truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pre-line {
  white-space: pre-line;
}
/*
 * --- Special tuning (more complex classes relations) ---
 */
.img-wrapper {
  margin: 20px 0px;
}
.img-wrapper>p {
  text-align: center;
}
/* Tooltips with html */
.tooltip ul {
  padding-left: 20px;
}
.tooltip ul:last-child {
  margin-bottom: 0px;
}
/* control label in form hotizontal */
@media (max-width: 991px) {
  .form-horizontal .control-label[class*="col-md-"] {
    padding-top: 0px;
  }
}
/* selectpicker */
.from-right-to-left > .dropdown-menu {
  right: 0px;
  left: auto;
}
/* Styling to make checkbox with form-control class render as big one */
input[type='checkbox'].form-control {
/*div.form-group>input[type='checkbox'], td>input[type='checkbox'] {*/
  width: 30px;
  height: 30px;
  margin: 2px;
}
/*
 * === for webmqttclient ===
 */
/* Connection status */
/* For states on/off (in footer) */
.state-on:after, .connected:after {
  content: " ON";
  color: #009700;
}
.state-off:after, .notconnected:after {
  content: " OFF";
  color: #bc0000;
}
.connected {
  background-color: inherit;
  color: #009700;
}
.notconnected {
  background-color: inherit;
  color: #bc0000;
}
/*for dygraph - position of chart etc*/
.annotationStyle {
  font-weight: bold;
  /*padding-top: 4px;
  padding-bottom: 4px;*/
  opacity: 0.7;
  border: solid 2px;
  border-radius: 4px;
}
.graph-div {
  position: absolute;
  left: 1px;
  right: 2px;
  top: 1px;
  bottom: 2px;
}
.graph-wrapper {
  height: 500px;
  padding: 0px;
}
.graph-legend {
  position: absolute;
  right: 80px;
  z-index: 9999;
  /* background-color: rgba(255,255,255,0.5); */
}
/* For configpanel - status display */
blockquote.configpanel-status {
  font-size: unset;
}
.configpanel-status > :last-child {
  margin-bottom: 0px;
}
/*
 * --- Loader ---
 */
.loader-block {
  background: #fffaf0e6;
  z-index: 20;
  opacity: 1;
  transition: all 0.5s;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.loader-block.off {
  z-index: -1;
  opacity: 0;
}
.loader-body {
  margin: 300px 20% 0px;
}

/*SCROLLBAR*/
/*::-webkit-scrollbar {
    width: 12px;
}
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px #eaeaea;
  -webkit-border-radius: 10px;
    box-shadow: inset 0 0 6px #eaeaea;
    border-radius: 10px;
    border: #000;
}
::-webkit-scrollbar-thumb {
  -webkit-border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px #d9d9d9;
    box-shadow: inset 0 0 6px #d9d9d9;
    background: #d9d9d9;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: #b3b3b3;
}
::-webkit-scrollbar-thumb:window-inactive {
  background: #e6e6e6;
}*/

/*
 * --- ToastController ---
 */
.toast {
  min-width: 250px;
  /* Set a default minimum width */
  margin-left: -125px;
  /* Divide value of min-width by 2 */
  text-align: center;
  /* Centered text */
  position: fixed;
  /* Sit on top of the screen */
  z-index: 1;
  /* Add a z-index if needed */
  left: 50%;
  /* Center the snackbar */
  bottom: 30px;
  /* 30px from the bottom */
}
/*
 * --- Admin pages ---
 */
.admin-breadcrumb {
  background-image: linear-gradient(to bottom,#505050 0,#757575 100%);
  background-color: #5d5d5d;
}
.admin-breadcrumb > .container > .breadcrumb {
  margin-bottom: 0px;
  border-radius: 0px;
  padding: 8px 0px;
  background-color: inherit;
}
.admin-breadcrumb > .container > .breadcrumb a {
  color: blanchedalmond;
}
.admin-breadcrumb > .container > .breadcrumb a:hover,
.admin-breadcrumb > .container > .breadcrumb a:focus {
  color: white;
}
.admin-breadcrumb > .container > .breadcrumb li.active {
  color: white;
}
/*
 * --- Panel with bootstrap's glyphicon-chevron arrow ---
 */
.panel-heading .glyphicon-chevron:before {
  content: "\e113";
}
.panel-heading.collapsed .glyphicon-chevron:before {
  content: "\e114";
}
.panel-heading[data-toggle="collapse"] {
  cursor: pointer;
}
 /*
 * --- Split panel navigation ---
 */
.panel-navigation > a {
  display: block;
  padding: 15px;
  border-bottom: 1px solid #ddd;
  color: #000;
  text-decoration: none;
  font-weight: 600;
}
.panel-navigation > a:last-child {
  border-bottom: none;
}
.panel-navigation > a:hover,
.panel-navigation > a:focus {
  background-color:#ddd;
}
.panel-navigation > a.active {
  background-color: #000;
  color: #fff;
  border-color: #000;
  cursor: default;
}
.panel-navigation {
  padding-right: 15px;
}
@media (max-width: 767px) {
  .panel-navigation {
    border-bottom: 1px solid #484e55;
    padding-right: 0;
  }
  .panel-navigation > a {
    padding: 10px 15px;
  }
}
.row.no-gutters {
  margin-right: 0px;
  margin-left: 0px;
}
.row.no-gutters > div[class*="col-"] {
  padding-right: 0px;
  padding-left: 0px;
}
.panel-content > .table > tbody:first-child > tr:first-child th {
  border-top: 0;
}
/*
 * --- Privacy policy, support, terms, etc. ---
 */
.google-pages-like h1, .google-pages-like h2, .google-pages-like h3 {
  color: rgba(11,100,90,1);
}
.google-pages-like h1, .google-pages-like h2 {
  font-family: Roboto, sans-serif;
}
.google-pages-like p a, .google-pages-like section a {
  color: rgba(11,100,90,1);
  text-decoration: underline;
}
.google-pages-like section .page-header {
  margin-bottom: 10px;
}
.google-pages-like section {
  padding: 24px 0;
}
.google-pages-like section h2 {
  margin-top: 0px;
  margin-bottom: 2rem;
}
.google-pages-like section li, .google-pages-like section p {
  font-size: 16px
}
/*
 * ---  Utilities classes from bootstrap4 ---
 */
.no-gutters {
  margin-right: 0;
  margin-left: 0;
}

.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}

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

.font-weight-normal {
  font-weight: 400 !important;
}

.font-weight-bold {
  font-weight: 700 !important;
}

.font-italic {
  font-style: italic !important;
}

.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

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

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-inline-flex {
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
}

.align-baseline {
  vertical-align: baseline !important;
}

.align-top {
  vertical-align: top !important;
}

.align-middle {
  vertical-align: middle !important;
}

.align-bottom {
  vertical-align: bottom !important;
}

.align-text-bottom {
  vertical-align: text-bottom !important;
}

.align-text-top {
  vertical-align: text-top !important;
}

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

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

.w-25 {
  width: 25% !important;
}

.w-50 {
  width: 50% !important;
}

.w-75 {
  width: 75% !important;
}

.w-100 {
  width: 100% !important;
}

.w-auto {
  width: auto !important;
}

.h-25 {
  height: 25% !important;
}

.h-50 {
  height: 50% !important;
}

.h-75 {
  height: 75% !important;
}

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

.h-auto {
  height: auto !important;
}

.mw-100 {
  max-width: 100% !important;
}

.mh-100 {
  max-height: 100% !important;
}

.mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

.m-0 {
  margin: 0 !important;
}

.mt-0,
.my-0 {
  margin-top: 0 !important;
}

.mr-0,
.mx-0 {
  margin-right: 0 !important;
}

.mb-0,
.my-0 {
  margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
  margin-left: 0 !important;
}

.m-1 {
  margin: 0.25rem !important;
}

.mt-1,
.my-1 {
  margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
  margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
  margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
  margin-left: 0.25rem !important;
}

.m-2 {
  margin: 0.5rem !important;
}

.mt-2,
.my-2 {
  margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
  margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
  margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
  margin-left: 0.5rem !important;
}

.m-3 {
  margin: 1rem !important;
}

.mt-3,
.my-3 {
  margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
  margin-right: 1rem !important;
}

.mb-3,
.my-3 {
  margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
  margin-left: 1rem !important;
}

.m-4 {
  margin: 1.5rem !important;
}

.mt-4,
.my-4 {
  margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
  margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
  margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
  margin-left: 1.5rem !important;
}

.m-5 {
  margin: 3rem !important;
}

.mt-5,
.my-5 {
  margin-top: 3rem !important;
}

.mr-5,
.mx-5 {
  margin-right: 3rem !important;
}

.mb-5,
.my-5 {
  margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
  margin-left: 3rem !important;
}

.p-0 {
  padding: 0 !important;
}

.pt-0,
.py-0 {
  padding-top: 0 !important;
}

.pr-0,
.px-0 {
  padding-right: 0 !important;
}

.pb-0,
.py-0 {
  padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
  padding-left: 0 !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.pt-1,
.py-1 {
  padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
  padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
  padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
  padding-left: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.pt-2,
.py-2 {
  padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
  padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
  padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
  padding-left: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.pt-3,
.py-3 {
  padding-top: 1rem !important;
}

.pr-3,
.px-3 {
  padding-right: 1rem !important;
}

.pb-3,
.py-3 {
  padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
  padding-left: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.pt-4,
.py-4 {
  padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
  padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
  padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
  padding-left: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

.pt-5,
.py-5 {
  padding-top: 3rem !important;
}

.pr-5,
.px-5 {
  padding-right: 3rem !important;
}

.pb-5,
.py-5 {
  padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
  padding-left: 3rem !important;
}

.shadow {
  -webkit-box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
  -moz-box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
}