html { color: #bdc7b8; font: calc(0.40rem + 1vmin) monospace; overflow-y: scroll; background-color: #241e1e; } body { margin-right: auto; margin-left: auto; min-width: 33rem; max-width: 53rem; } @media only screen and (max-width: 53rem) { body { margin: 0 2rem; } } a { color:#6CF; text-shadow: 1px 1px 0px #000c; } a.no-shadow { text-shadow: initial; } a:hover, a:active, a:visited { color: #b5bd68; } .nav-links a { margin: 0 1em; } .flash { color: rgb(173, 74, 8); font-weight: bold; text-align: center; border: 1px dashed rgb(173, 74, 8); border-radius: 0.5em; margin-bottom: 2em; padding: 1em; } .flash.green { color: rgb(8, 173, 137); border-color: rgb(8, 173, 137); } .error { color: rgb(173, 74, 8); font-weight: bold; } .disabled { color: #585a5c; } .display-none { display: none; } h1, h2, h3, h4, h5 { font-size:calc(0.40rem + 1vmin); margin: initial; padding: initial; text-transform: uppercase; text-shadow: 2px 2px 0px #0007; } h1.no-text-transform, h2.no-text-transform, h3.no-text-transform, h4.no-text-transform, h5.no-text-transform { text-transform: none; } blockquote { margin: 0; padding-left: 2em; border-left: 2px solid #bdc7b844; } main { border: 1px dashed #bdc7b8; padding: 1rem; margin-bottom: 2em; display: flex; flex-direction: column; align-items: center; } .full-margin { width: 100%; margin: 3rem 0; } .half-margin { width: 100%; margin: 1.5rem 0; } .third-margin { width: 100%; margin: 1rem 0; } .row { display: flex; align-items: center; justify-content: space-around; width: 100%; } .center { align-items: center; } .wrap { flex-wrap: wrap; } .row.grid-large > div { flex: 1 1 20em; } .row.grid-small > div { flex: 0 0 8em; } .justify-start { justify-content: flex-start; } .justify-end { justify-content: flex-end; } .justify-space-between { justify-content: space-between; } .justify-center { justify-content: center; } form { display: flex; flex-direction: column; align-items: flex-start; margin: 0; } pre.wrap { white-space: normal; } label.align, .vm-actions form { min-width: 10em; } input, textarea, select, label { margin: 0.5em; } input, select, textarea { outline: 0; padding: 0.25em 0.5em; color: #bdc7b8; background-color: #bdc7b805; } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url(/static/dropdown-handle.png); background-repeat: no-repeat; background-position: bottom 0.65em right 0.8em; background-size: 0.5em; padding-right: 2em; } input[type=text], input[type=number], textarea { font: calc(0.40rem + 1vmin) monospace; border: 1px solid #777e73; outline: 0; } input[type=text], textarea { min-width: 20em; } input[type=text].expand, textarea.expand { width: 100%; } textarea { height: 6em; } input[type=checkbox] { margin: 0; } input[type=submit], select { font: calc(0.40rem + 1vmin) monospace; border: 1px solid #777e73; border-radius: 0.5em; } input[type=submit], select { cursor: pointer; } input[type=submit].form-submit-link { border: none; background-color: initial; color: #6CF; padding: 0; margin: 0; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ input[type=number] { -moz-appearance: textfield; } input[type=image].submit { background-color: #0000; } ul li, ol li { margin: 0.5em 0; margin-left: 1.2rem; } .long-form p, .long-form li, .long-form blockquote { line-height: 2em; } .long-form p .code, .long-form li .code, .long-form blockquote .code { line-height: 1em; padding: 5px; padding-top: 3px; margin-top: 2px; padding-bottom: 4px; border-radius: 4px; } hr { width: 100%; } table{ border-collapse: collapse; } thead { background: #bdc7b812; } td, th { padding: 0.1em 1em; } table.small td, table.small th { font: calc(0.35rem + 0.83vmin) monospace; padding: 0.1em 1em; } table.small td.metrics { padding: 0; } th.heart-icon { font-size: calc(0.40rem + 2.3vmin); line-height: 1rem; padding-left: 0.3rem; padding-right: 0.2rem; padding-bottom: 0.4rem; } td.capsul-status { line-height: 1rem; padding: 0; padding-left: 0.07em; font-size: calc(0.4rem + 3.4vmin); padding-top: 0.2rem; } td.capsul-status-questionmark { padding: 0; padding-left: 0.5em; } td.metrics img { margin-left: -1.2em; margin-right: -1.2em; margin-top: -0.25em; margin-bottom: -0.25em; width: 4.3em; } th { border-right: 4px solid #241e1e; text-align: left; } td { font: calc(0.35rem + 0.95vmin) monospace; border-bottom: 2px dotted #777e7355; padding-top: 0.4rem; padding-bottom: 0.4rem; } .invalidated { text-decoration: line-through; } .waiting-pulse { animation: waiting-pulse 1s ease-in-out 0s infinite forwards alternate; } @keyframes waiting-pulse { from { color: rgba(221, 169, 56, 0.8); } to { color: rgba(221, 169, 56, 0.2); } } div.metric { display: flex; align-items: last baseline; flex-direction: column; margin: 0.7em; } .code { display: inline-block; padding: 0.5em 1.2em; border-radius: 0.5em; border: 1px solid #777e73; background: #bdc7b810; } pre.code.wrap { white-space: pre-wrap; } .break-all { word-break: break-all; } .dim { color: #777e73bb; } .red { color: #c21d00; } .green { color: #069e5f; } .yellow { color: rgba(221, 169, 56, 0.8); } footer, p { text-align: left; } footer { margin: 2rem 0; } .bigtext { display: inline-block; position: relative; top: 0.17rem; font-size: 1.8em; } .smalltext { font-size: 0.8em; } .network-row { background-color: #777e7350; padding: 5px; margin-top: 5px; } .network-display { height: 1em; border: 1px solid #777e73; } .network-display div { position: absolute; } .network-display div div { top: 1px; height: calc(1em - 2px); background-color: rgba(221, 169, 56, 0.8); border: 1px solid rgba(255, 223, 155, 0.8); box-sizing: border-box; position: relative; } form.megaphone { margin-top: 1rem; width: 640px; max-width: 100%; } form.megaphone input[type=text], form.megaphone textarea { width: 100%; } form.megaphone textarea { height: 360px; }