@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: normal;
  src: url('/fonts/roboto/Roboto-Regular.ttf');
}
@font-face {
  font-family: "Roboto";
  font-style: italic;
  font-weight: normal;
  src: url('/fonts/roboto/Roboto-Italic.ttf');
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: bold;
  src: url('/fonts/roboto/Roboto-Medium.ttf');
}
@font-face {
  font-family: "Noto Sans Mono";
  font-style: normal;
  font-weight: normal;
  src: url('/fonts/noto-mono/NotoSansMono-Regular.ttf');
}
body {
  font-family: 'Roboto', 'Helvetica', 'Arial', 'sans-serif';
  margin: 0;
  padding: 0;
  font-size: 14px;
  line-height: 1.5em;
  color: hsl(210, 30%, 13%);
  background: #fff;
}
a {
  color: hsl(205, 100%, 46%);
}
a img {
  border: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Roboto', 'Helvetica', 'Arial', 'sans-serif';
  font-weight: normal;
  line-height: 1.5em;
}
code {
  font-family: 'Noto Sans Mono', 'Consolas', 'Courier New', 'Courier', monospace;
}
pre {
  font-family: 'Noto Sans Mono', 'Consolas', 'Courier New', 'Courier', monospace;
}
.button1 {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  font-size: 14px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
}
.button2 {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  font-size: 14px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 10px 16px 10px 16px;
  font-size: 16px;
  line-height: 1.3em;
}
.full {
  padding-left: 10px;
  padding-right: 10px;
}
.col {
  padding-left: 10px;
  padding-right: 10px;
  margin-left: auto;
  margin-right: auto;
  max-width: 960px;
}
.tcol {
  padding-left: 10px;
  padding-right: 10px;
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
}
.bcol {
  padding-left: 10px;
  padding-right: 10px;
  margin-left: auto;
  margin-right: auto;
  max-width: 560px;
}
.icol {
  padding-left: 10px;
  padding-right: 10px;
  margin-left: auto;
  margin-right: auto;
  max-width: 880px;
}
.fullscreen {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.sec {
  padding-left: 10px;
  padding-right: 10px;
  margin-left: auto;
  margin-right: auto;
  max-width: 960px;
  padding-top: 10px;
  padding-bottom: 10px;
}
div.path span.sep {
  padding-left: 9px;
  padding-right: 9px;
}
.comment {
  color: #777;
}
a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
.mono {
  font-family: "Noto Sans Mono", monospace;
}
.mono14 {
  font-family: "Noto Sans Mono", monospace;
  font-size: 14px;
}
.mono13 {
  font-family: "Noto Sans Mono", monospace;
  font-size: 13px;
}
.mono12 {
  font-family: "Noto Sans Mono", monospace;
  font-size: 12px;
}
.mono11 {
  font-family: "Noto Sans Mono", monospace;
  font-size: 11px;
}
div.article {
  font-size: 16px;
  line-height: 1.5em;
}
div.article h1,
div.article h2,
div.article h3,
div.article h4,
div.article h5,
div.article h6 {
  font-weight: normal;
  line-height: 1.5em;
}
div.article h1 {
  font-size: 28px;
  margin-top: 40px;
  margin-bottom: 30px;
}
div.article h2 {
  font-size: 24px;
  margin-top: 24px;
  margin-bottom: 12px;
}
div.article h3 {
  font-size: 20px;
  margin-top: 14px;
  margin-bottom: 5px;
}
div.article h4 {
  font-size: 18px;
  margin-top: 7px;
  margin-bottom: 5px;
}
div.article h5 {
  font-size: 17px;
  margin-top: 5px;
  margin-bottom: 3px;
}
div.article h6 {
  font-size: 16px;
  margin-top: 5px;
  margin-bottom: 3px;
}
div.article p {
  margin-top: 7px;
  margin-bottom: 12px;
}
div.article hr {
  margin-top: 20px;
  margin-bottom: 20px;
  width: 80%;
  border: 0;
  border-bottom: 1px dashed #ddd;
}
div.article h1 {
  text-align: center;
}
div.article h1.left {
  text-align: left;
}
div.article strong {
  font-weight: normal;
  color: #966900;
}
div.article em {
  color: #181;
}
div.article pre,
div.article code {
  font-family: "Noto Sans Mono", monospace;
  font-size: 14px;
}
div.article code {
  border-radius: 3px;
  border: 1px solid #ccc;
  background: #f7f7f7;
  padding: 2px 5px 2px 5px;
  white-space: nowrap;
}
div.article pre {
  background: #f7f7f7;
  border-radius: 3px;
  border: 1px solid #ccc;
  padding: 3px 8px 3px 8px;
  line-height: 20px;
  overflow: auto;
}
div.article pre code {
  border: none;
  padding: 0px;
  white-space: inherit;
}
div.article blockquote {
  color: #888;
}
div.article ul,
div.article ol {
  padding-left: 30px;
}
div.article table {
  margin-top: 20px;
  margin-bottom: 20px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  color: hsl(205, 100%, 46%);
}
div.dialog div.dialog-bg {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: hsla(211, 23%, 70%, 0.5);
}
div.dialog div.screen-center {
  position: fixed;
  left: 50%;
  top: 100px;
}
div.dialog div.dialog-box {
  position: absolute;
  width: 400px;
  height: auto;
  top: 100px;
  margin-left: -200px;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 10px 20px hsl(211, 27%, 80%);
  padding: 36px;
  text-align: center;
}
div.dialog div.dialog-box div.prompt strong.name {
  color: hsl(205, 100%, 46%);
}
div.dialog div.dialog-box div.buttons {
  margin-top: 30px;
}
body.dashboard {
  background: hsl(208, 37%, 95%);
}
div.topbar {
  background: hsl(205, 94%, 38%);
  color: hsl(208, 37%, 95%);
  line-height: 40px;
  height: 40px;
  padding-left: 16px;
  padding-right: 16px;
}
div.topbar span.logo {
  display: inline-block;
  padding-right: 10px;
}
div.topbar span.logo img.logo {
  margin-top: -3px;
  vertical-align: middle;
  width: 20px;
  height: 20px;
}
div.topbar a {
  color: hsl(208, 37%, 95%);
}
div.topbar span.right {
  font-size: 14px;
  float: right;
  width: 300px;
  text-align: right;
}
div.topbar span.right span.part:last-child {
  padding-right: 0;
}
div.topbar span.right span.part {
  padding-right: 7px;
  padding-left: 7px;
}
div.menu {
  float: left;
  width: 240px;
}
div.menu ol.links {
  padding-left: 16px;
  padding-right: 10px;
  list-style: none;
}
div.menu ol.links li {
  padding-top: 2px;
  padding-bottom: 2px;
}
div.menu ol.links li a {
  color: hsl(209, 28%, 23%);
}
#button {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 7px 16px 7px 16px;
  font-size: 14px;
  line-height: 1.5em;
  margin-right: 10px;
}
#std-input {
  font-family: 'Roboto', 'Helvetica', 'Arial', 'sans-serif';
  font-size: 16px;
  line-height: 1.5em;
  padding: 4px 10px 4px 10px;
  border: 2px hsl(211, 27%, 80%) solid;
  border-radius: 3px;
  width: 300px;
}
div.view {
  margin-top: 16px;
  margin-left: 240px;
  margin-right: 16px;
  margin-bottom: 16px;
  background-color: #fff;
  border-radius: 5px;
  min-height: 400px;
  padding-left: 24px;
  padding-right: 24px;
  padding-top: 16px;
  padding-bottom: 24px;
  box-shadow: 1px 1px 3px 0 hsl(211, 27%, 80%);
}
div.view h2 {
  color: hsl(205, 100%, 46%);
  margin-top: 0;
  padding-top: 0;
  font-size: 18px;
}
div.view span.warning {
  color: hsl(356, 63%, 44%);
}
div.view span.error {
  color: hsl(356, 63%, 44%);
}
div.view span.ok {
  color: hsl(134, 52%, 50%);
}
div.view form input {
  font-family: 'Roboto', 'Helvetica', 'Arial', 'sans-serif';
}
div.view form input[type="password"] {
  font-family: 'Roboto', 'Helvetica', 'Arial', 'sans-serif';
  font-size: 16px;
  line-height: 1.5em;
  padding: 4px 10px 4px 10px;
  border: 2px hsl(211, 27%, 80%) solid;
  border-radius: 3px;
  width: 300px;
}
div.view form input[type="text"] {
  font-family: 'Roboto', 'Helvetica', 'Arial', 'sans-serif';
  font-size: 16px;
  line-height: 1.5em;
  padding: 4px 10px 4px 10px;
  border: 2px hsl(211, 27%, 80%) solid;
  border-radius: 3px;
  width: 300px;
}
div.view form div.submit {
  margin-top: 16px;
  margin-bottom: 10px;
}
div.view form div.submit input.submit {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 7px 16px 7px 16px;
  font-size: 14px;
  line-height: 1.5em;
  margin-right: 10px;
  background: hsl(208, 37%, 90%);
}
div.view form div.submit input.submit:hover {
  background: hsl(211, 27%, 80%);
}
div.view form div.submit input.green-submit {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 7px 16px 7px 16px;
  font-size: 14px;
  line-height: 1.5em;
  margin-right: 10px;
  background: hsl(134, 59%, 39%);
  color: hsl(208, 37%, 95%);
}
div.view form div.submit input.green-submit:hover {
  background: hsl(134, 52%, 50%);
}
div.view div.overview h3 {
  margin-top: 0;
}
div.view div.overview div.section {
  margin-bottom: 36px;
}
div.view div.overview div.apps {
  display: flex;
  flex-flow: row wrap;
}
div.view div.overview div.app {
  text-align: center;
}
div.view div.overview .logo {
  display: block;
  width: 120px;
  height: 120px;
  border-radius: 20px;
  margin-bottom: 10px;
}
div.view div.logs table {
  font-family: 'Noto Sans Mono', 'Consolas', 'Courier New', 'Courier', monospace;
  font-size: 12px;
  line-height: 1.7em;
}
div.view div.logs table td {
  padding-left: 10px;
  padding-right: 10px;
}
div.view div.logs table td:first-child {
  padding-left: 0;
}
div.view div.logs table td:last-child {
  padding-right: 0;
}
div.view div.two-factor div.error {
  margin-top: 7px;
  margin-bottom: 7px;
}
div.view div.two-factor div.qr {
  margin-bottom: 16px;
  margin-top: 16px;
}
div.view div.ssh-keys textarea {
  font-family: 'Noto Sans Mono', 'Consolas', 'Courier New', 'Courier', monospace;
  height: 300px;
  width: 100%;
  max-width: 500px;
  word-break: break-all;
}
div.view div.ssh-keys div.controls {
  margin: 16px 0;
}
div.view form.password div.line {
  padding-top: 7px;
  padding-bottom: 7px;
}
div.view form.password div.line span.field {
  display: inline-block;
  width: 180px;
}
div.view form.password div.submit span.warning,
div.view form.password div.submit span.ok {
  margin-left: 24px;
  margin-right: 4px;
}
div.view form.activate div.line {
  padding-top: 7px;
  padding-bottom: 7px;
}
div.view form.activate input[type="text"] {
  width: 100px;
}
div.view span.button-danger {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 7px 16px 7px 16px;
  font-size: 14px;
  line-height: 1.5em;
  margin-right: 10px;
  color: hsl(356, 63%, 44%);
  border: 1px solid hsl(354, 68%, 55%);
  background: hsl(208, 37%, 95%);
}
div.view span.button-danger:hover {
  color: #fff;
  background: hsl(354, 68%, 55%);
  border: 1px solid hsl(354, 68%, 55%);
}
div.view span.button-red {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 7px 16px 7px 16px;
  font-size: 14px;
  line-height: 1.5em;
  margin-right: 10px;
  color: #fff;
  background: hsl(356, 63%, 44%);
  border: 1px solid hsl(356, 63%, 44%);
}
div.view span.button-red:hover {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 7px 16px 7px 16px;
  font-size: 14px;
  line-height: 1.5em;
  margin-right: 10px;
  background: hsl(354, 68%, 55%);
  border: 1px solid hsl(354, 68%, 55%);
}
div.view span.button-gray {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 7px 16px 7px 16px;
  font-size: 14px;
  line-height: 1.5em;
  margin-right: 10px;
  background: hsl(208, 37%, 95%);
  border: 1px solid hsl(211, 27%, 80%);
  color: hsl(210, 30%, 13%);
}
div.view span.button-gray:hover {
  background: hsl(208, 37%, 90%);
}
div.view span.button-green {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 7px 16px 7px 16px;
  font-size: 14px;
  line-height: 1.5em;
  margin-right: 10px;
  color: hsl(208, 37%, 95%);
  background: hsl(134, 59%, 39%);
  border: 1px solid hsl(134, 59%, 39%);
}
div.view span.button-green:hover {
  background: hsl(134, 52%, 50%);
  border: 1px solid hsl(134, 52%, 50%);
}
div.confirm-password {
  padding-top: 36px;
  padding-bottom: 36px;
  text-align: center;
}
div.confirm-password div.error {
  padding-top: 7px;
  padding-bottom: 7px;
  color: hsl(356, 63%, 44%);
  font-size: 16px;
}
div.confirm-password form {
  text-align: center;
  font-size: 18px;
  line-height: 1.5em;
}
div.confirm-password form input.password {
  border: 1px solid hsl(210, 23%, 36%);
  margin-left: 16px;
  margin-right: 16px;
  width: 200px;
  font-size: 18px;
  line-height: 1.5em;
  border-radius: 3px;
  padding: 4px;
}
div.confirm-password form input.submit {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  padding: 7px 16px 7px 16px;
  font-size: 14px;
  line-height: 1.5em;
  margin-right: 10px;
  color: hsl(208, 37%, 95%);
  background-color: hsl(134, 59%, 39%);
}
body {
  font-family: 'Roboto', 'Helvetica', 'Arial', 'sans-serif';
  margin: 0;
  padding: 0;
  font-size: 15px;
  line-height: 1.5em;
  color: hsl(209, 28%, 23%);
  background: #fff;
}
a {
  color: hsl(205, 100%, 46%);
}
body.cover {
  background: hsl(205, 100%, 46%);
  color: hsl(208, 37%, 95%);
}
div.login {
  padding-top: 24px;
  overflow: auto;
}
div.login div.logo {
  background: url('/img/logo-big.png') center no-repeat;
  background-size: 300px 300px;
  height: 300px;
  margin-bottom: 24px;
}
div.login div.redirect {
  margin-top: 36px;
  margin-bottom: 10px;
  text-align: center;
}
div.login div.redirect a {
  color: hsl(208, 37%, 95%);
  text-decoration: underline;
}
div.login form.login {
  font-size: 18px;
  text-align: center;
}
div.login form.login div.line {
  padding: 7px;
  line-height: 60px;
  font-size: 16px;
}
div.login form.login div.line span.prompt {
  width: auto;
  display: inline-block;
  text-align: center;
}
div.login form.login div.line input.password {
  font-family: 'Roboto', 'Helvetica', 'Arial', 'sans-serif';
  margin-left: 16px;
  margin-right: 16px;
  width: 200px;
  font-size: 18px;
  line-height: 1.5em;
  padding: 7px;
  border: none;
  border-radius: 3px;
}
div.login form.login input.submit {
  display: inline-block;
  text-align: center;
  padding: 7px 10px 7px 10px;
  border-radius: 4px;
  font-size: 14px;
  line-height: 1.2em;
  cursor: pointer;
  border: none;
  box-shadow: 0 1px 1px hsl(211, 23%, 70%);
  margin-top: 7px;
  margin-bottom: 7px;
  color: hsl(208, 37%, 95%);
  padding-left: 24px;
  padding-right: 24px;
  background-color: hsl(134, 59%, 39%);
  box-shadow: 0 2px 5px hsl(210, 23%, 36%);
}
div.login form.login input.submit:hover {
  background-color: hsl(134, 52%, 50%);
}
div.login form.login div.hint {
  color: hsl(208, 37%, 90%);
  font-size: 14px;
  line-height: 1.5em;
}
div.login div.error {
  color: hsl(208, 37%, 95%);
  font-size: 16px;
  line-height: 1.5em;
  text-align: center;
  margin-bottom: 4px;
}
