@import "../node_modules/leaflet/dist/leaflet.css";
.notifications {
  position: absolute;
  right: 1em;
}
.notify {
  position: relative;
  min-height: 1em;
  margin: 1em 0;
  padding: 1em 1.5em;
  color: rgba(0, 0, 0, 0.87);
  -webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease;
  -webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
  transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
  transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease;
  transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease;
  -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 transparent;
          box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 transparent;
  background: #ccc;
  color: #000;
}
.notify.success {
  background: #009ee0;
  color: #fff;
}
.notify.warn {
  background: #ffb400;
  color: #000;
}
.notify.error {
  background: #dc0067;
  color: #fff;
}
header {
  width: 100%;
  height: 50px;
}
header > div {
  display: inline-block;
}
nav {
  background-color: #373636;
  position: fixed;
  display: inline-block;
  font-weight: 700;
  width: 100%;
  height: 50px;
}
nav ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
}
nav ul > li,
nav ul li.right {
  float: left;
  display: inline-block;
}
nav ul > li.right,
nav ul li.right.right {
  float: right;
}
nav ul > li a,
nav ul li.right a,
nav ul > li span,
nav ul li.right span {
  display: inline-block;
  cursor: pointer;
  text-decoration: none !important;
  text-align: center;
  text-transform: uppercase;
  color: inherit;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 1.1em .5em;
  height: 50px;
}
nav ul > li:hover,
nav ul li.right:hover,
nav ul > li.active,
nav ul li.right.active {
  background: rgba(255, 255, 255, 0.2);
}
nav ul > li.item-1,
nav ul li.right.item-1 {
  background: #ffb400;
  color: #000;
}
nav ul > li.item-2,
nav ul li.right.item-2 {
  background: #dc0067;
  color: #fff;
}
nav ul > li.item-3,
nav ul li.right.item-3 {
  background: #ccc;
  color: #000;
}
nav .status {
  float: right;
  background-color: #009ee0;
  color: white;
  width: 50px;
  height: 50px;
}
nav .status.connecting,
nav .status.running {
  background-color: #ffb400;
  -webkit-animation: blinkDot 1s infinite steps(1);
          animation: blinkDot 1s infinite steps(1);
}
nav .status.offline,
nav .status.failed {
  background-color: #dc0067;
  -webkit-animation: blinkDot 2s infinite steps(1);
          animation: blinkDot 2s infinite steps(1);
}
@-webkit-keyframes blinkDot {
  50% {
    background-color: rgba(255, 255, 255, 0.25);
  }
}
@keyframes blinkDot {
  50% {
    background-color: rgba(255, 255, 255, 0.25);
  }
}
nav .login {
  float: right;
  display: inline-block;
  cursor: pointer;
  text-decoration: none !important;
  text-align: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 1em .5em;
  height: 50px;
  color: #fff;
}
nav .login a {
  color: #fff;
  padding-left: 2px;
}
nav .login input {
  color: white;
}
.leaflet-container .node {
  width: 3px;
  height: 3px;
  background-color: rgba(0, 0, 255, 0.5);
  border: 2px solid white;
  border-radius: 10px;
}
.leaflet-container .node.warn {
  background-color: rgba(255, 165, 0, 0.7);
}
.leaflet-container .node.offline {
  background-color: rgba(255, 0, 0, 0.7);
}
.leaflet-container .node.client24 {
  border-left: 3px solid green;
}
.leaflet-container .node.client5 {
  border-right: 3px solid green;
}
.leaflet-container .node.client24-warn {
  border-left: 3px solid yellow;
}
.leaflet-container .node.client5-warn {
  border-right: 3px solid yellow;
}
.leaflet-container .node.client24-crit {
  border-left: 3px solid red;
}
.leaflet-container .node.client5-crit {
  border-right: 3px solid red;
}
.leaflet-container .nodeicon-label {
  font-size: 12px;
  font-weight: lighter;
}
.leaflet-container .nodeicon-label table {
  width: 100%;
}
.leaflet-container .nodeicon-label td {
  border-top: 1px solid #999;
  text-align: right;
}
.leaflet-container .nodeicon-label td:first-child {
  text-align: left;
}
body {
  position: relative;
  margin: 0px;
  font-size: 15px;
  color: #333;
  line-height: 1.3;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.withTextMargins {
  margin-left: 0.5em;
  margin-right: 0.5em;
}
span.online {
  color: #009ee0;
}
span.offline {
  color: #dc0067;
}
.pinger div {
  display: inline-block;
  width: 4px;
  height: 4px;
  margin-right: 2px;
  background-color: red;
}
.pinger .online {
  background-color: green;
}
h1 {
  border-bottom: 4px solid #dc0067;
}
thead {
  font-size: 1.3em;
  font-weight: bold;
  cursor: default;
}
thead tr th {
  border-bottom: 4px solid #dc0067;
}
table th > input {
  border: none;
  color: #000;
  font-weight: bold;
  background: #fff;
}
table th.sort-header:after {
  font-size: 0.6em;
}
table th.sort-header.sort-down:after {
  content: " \25BC";
}
table th.sort-header.sort-up:after {
  content: " \25B2";
}
table th.sort-header:not(.sort-down):not(.sort-up):after {
  content: " \25B4\25BE";
  color: grey;
}
table.nodes,
table.stats {
  width: 100%;
}
table.nodes td > span {
  display: block;
}
table.nodes tbody tr:nth-child(even) {
  background: #eee;
}
table.nodes tbody tr:nth-child(odd) {
  background: #fff;
}
table.nodes tbody tr:hover {
  background: #ccc;
}
table.nodes tbody tr td.offline,
table.nodes tbody tr td.offline:hover {
  background: #dc0067;
}
table.nodes tbody tr td.unseen {
  background: #009ee0;
}
table tr.line td,
table tr.line th {
  border-bottom: 1px solid #ffb400;
}
table.stats td {
  text-align: center;
}
.btn {
  display: inline-block;
  padding: .3em .5em;
  border-radius: 1em;
  color: #fff;
  background-color: #dc0067;
  text-align: center;
  cursor: pointer;
}
.btn:hover {
  background: #f60073;
}
a.btn:hover {
  text-decoration: none;
}
a {
  color: #dc0067;
  text-decoration: none;
}
input {
  border: none;
  border-bottom: 1px solid grey;
  background: none;
  padding: 0px;
  font-size: 15px;
  color: #333;
  line-height: 1.3;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/*# sourceMappingURL=styles.css.map */
