@import url('https://fonts.googleapis.com/css?family=Roboto:300,700|Roboto+Condensed:300,400');
body {
  font: 300 1em 'Roboto', sans-serif;
}

h1,h2 {
  font-weight: 300;
}

th {
  
}
strong {
  font-weight: 700;
}

.btn {
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
}

[v-cloak] {
  display: none;
}

.jumbotron {
  background: url(index-bg.jpg) center no-repeat;
  background-size: cover;
}

#jumbotron-brand-logo {
  height: 18em;
  width: auto;
}

.jumbotron .col {
  margin-top: 1em;
  margin-bottom: 1em;
}

.jumbotron h1 {
  font-size: 5em;
}

#signin-brand-logo {
  height: 6em;
  width: auto;
}

#navbar-brand-logo {
  height: 1.3em;
  width: auto;
  vertical-align: bottom;
}

#navbar-menu {
  padding-top: 1ex;
}

#nav-link-perc {
  color: #ffffff;
}

#navbar-userphoto {
  width: 2em;
  height: 2em;
}

/*
Store Boxes
*/

#sboxes {
  display: grid;
  grid-gap: 2px;
  grid-template-columns: repeat(auto-fill, minmax(6em, 1fr));
}

.sbox {
  height: 6em;
  background-color: #eee;
  color: #000;
  border: 3px solid #fff;
  padding: 4px;
  text-align: center;
}

.s-na {
  color: #ccc;
}

.sbg-na {
  background-color: #eee;
}

.sbg-up-0 {
  background-color: #5d5;
}

.sbg-up-1 {
  background-color: #8e8;
}

.sbg-up-2 {
  background-color: #beb;
}

.sbg-up-3 {
  background-color: #ded;
}

.sbg-alarm {
  background-color: #fd7;
}

.sbg-down {
  background-color: #faa;
}

.sln-open {
  border-color: #f33;
}

.sln-ack {
  border-color: #7af;
}


.sbox p {
  margin: 0;
}

.sbox .num {
  float: left;
}

.sbox .name {
  font: normal 1em 'Roboto Condensed', sans-serif;
  white-space: nowrap;
  overflow: hidden;
}

.sbox .contents {
  height: 3em;
  font-size: smaller;
  padding: 4% 0;
  line-height: 1.4;
}

.sbox .indicators {
  margin-top: 0.1em;
  font: 300 1em 'Roboto Condensed', sans-serif;
}

.sbox .indicators img {
  width: 1em;
  height: 1em;
  vertical-align: top;
}

.store-on .bg-e85 {
  background-color: #ffeabb;
}

.store-on .bg-r99 {
  background-color: #d8ead8;
}

#modalStore th {
  font: 400 1em 'Roboto Condensed', sans-serif;
}

#modalStore .btn {
  margin: 0.1em;
}

#clipboard-container {
  width: 1px;
  height: 1px;
  padding: 0;
  border-width: 0;
  opacity: 0;
}

#footer {
  color: gray;
  font-size: smaller;
  text-align: center;
}


/*
 Status Info Pages
*/
body.statusinfo-page {
  background-size: cover;
  height: 100vh;
  width: 100vw;
}

.statusinfo-page .card {
}

.statusinfo-page #btncredit {
  opacity: 0.5;
}

/* User Not Allowed */
#notallowed-page {
  background: url(notallowed-bg.jpg) center no-repeat;
}

/* User Not Configured */
#notconfigured-page {
  background: url(notconfigured-bg.jpg) center no-repeat;
}

/* 404 Not Found */
#notfound-page {
  background: url(404-bg.jpg) center no-repeat;
}

#notfound-page .card {
  transform: rotate(-10deg);
}


/*
 Noty Theme
*/
.noty_theme__prpl.noty_bar {
  margin: 4px 0;
  overflow: hidden;
  border-radius: 2px;
  position: relative; }
.noty_theme__prpl.noty_bar .noty_body {
  padding: 10px;
  font-size: 14px; }
.noty_theme__prpl.noty_bar .noty_buttons {
  padding: 10px; }

.noty_theme__prpl.noty_type__alert,
.noty_theme__prpl.noty_type__notification {
  background-color: #eee;
  border-bottom: 1px solid #D1D1D1;
  color: #2F2F2F; }

.noty_theme__prpl.noty_type__warning {
  background-color: #FFAE42;
  border-bottom: 1px solid #E89F3C;
  color: #fff; }

.noty_theme__prpl.noty_type__error {
  background-color: #DE636F;
  border-bottom: 1px solid #CA5A65;
  color: #fff; }

.noty_theme__prpl.noty_type__info,
.noty_theme__prpl.noty_type__information {
  background-color: #7F7EFF;
  border-bottom: 1px solid #7473E8;
  color: #fff; }

.noty_theme__prpl.noty_type__success {
  background-color: #AFC765;
  border-bottom: 1px solid #A0B55C;
  color: #fff; }

#noty_layout__topCenter,#noty_layout__center,#noty_layout__bottomCenter {
  text-align: center;
}

#badbrowseralert div.noty_body {
  font-size: 18px;
}