html {
  font-family: sans-serif;
  background: #eee;
  padding: .5rem;
}

@media print {
  html {
    background: white;
  }
  .ba {
    break-after: page;
  }
}

body {
  margin: 0 auto;
  background: white;
}

h1, h2, h3, h4, h5, h6 {
  font-family: sans-serif;
  color: #61ce70;
  margin: 1rem 0;
}

.subtext {
  color: gray;
  margin: 0;
  margin-top: 1rem;
}

p {
  margin-top: 0;
}

a {
  color: #377ba8;
}

hr {
  border: none;
  border-top: 1px solid lightgray;
  width:100%;
}

hr.colsep {
  width: 1px;
  height: 100%;
  transform: rotateY(90deg);
}

nav {
  background: lightgray;
  display: flex;
  align-items: center;
  padding: 0 0.5rem;
}

nav h1 {
  flex: auto;
  margin: 0;
  width: 33%;
}

nav h1 a {
  text-decoration: none;
  padding: 0.25rem 0.5rem;
}

nav ul  {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
}

nav ul li a, nav ul li span, header .action {
  display: block;
  padding: 0.5rem;
  margin-bottom: .1rem;
}

.content {
  padding: 0 1rem 1rem;
}

.content > header {
  border-bottom: 1px solid lightgray;
  display: flex;
  align-items: flex-end;
}

.content > header h1 {
  flex: auto;
  margin: 1rem 0 0.25rem 0;
}

.flash {
  margin: 1em 0;
  padding: 1em;
  background: #cae6f6;
  border: 1px solid #377ba8;
  border-radius: 5px;
}

.error {
  background: #d44a4a;
  color: #fefefe;
  border: 1px solid #d34949;
}

.warning {
  background: #fca903;
  color: #fefefe;
  border: 1px solid #fba802;
}

.post > header {
  display: flex;
  align-items: flex-end;
  font-size: 0.85em;
}

.post > header > div:first-of-type {
  flex: auto;
}

.post > header h1 {
  font-size: 1.5em;
  margin-bottom: 0;
}

.post .about {
  color: slategray;
  font-style: italic;
}

.post .body {
  white-space: pre-line;
}

.content:last-child {
  margin-bottom: 0;
}

.content form {
  margin: 1em 0;
  display: flex;
  flex-direction: column;
}

.content input, .content textarea, .content select {
  margin-bottom: 1em;
  font-size: large;
}

input[type=file] {
  font-size: initial;
}

.content textarea {
  min-height: 12em;
  resize: vertical;
}

input.danger {
  color: #cc2f2e;
}

.linkBtnRed {
  background-color: #cc2f2e;
  color: #fcfcfc;
  text-decoration: none;
  padding: .7rem;
  border-radius: 5px;
}

header > .btnCnt {
  padding: .3rem;
}

.linkBtnGreen.action, .linkBtnRed.action {
  padding: .5rem;
  min-width: 0;
  font-weight: 530;
  margin-left: .2rem;
}

.linkBtnGreen, input[type=submit] {
  background-color: #22aa22;
  color: #fcfcfc;
  text-decoration: none;
  padding: .7em;
  border-radius: 5px;
  text-align:center;
  margin-bottom: 0;
}

.btnNav {
  text-align: center;
  width: 100%;
  max-width: fill-available;
  max-width: stretch;
  max-width: -webkit-fill-available;
  max-width: -moz-available;
  text-decoration: none;
  border-radius: 5px;
  margin: .2em;
  padding: .5rem;
  font-weight: 530;
  font-size: 2em;
}

.btnCnt {
  padding: 1rem;
}

.col {
  display:flex;
  flex-direction: column;
}

input[type=submit] {
  align-self: start;
  min-width: 10em;
}

.row {
  margin-top: .2rem;
  display:flex;
  flex-direction: row;
  width: 100%;
}
 .row label {
  margin-right: .1rem;
  margin-left: .1rem;
 }

 .whalf {
  width:50%;
 }
 .wfull {
  width:100%;
 }

 .halfrep {
  width: 49%;
  height: 100%;
 }

 .seprep {
  height: 100%;
 }

table, table *, footer {
  max-width: stretch;
    max-width: -webkit-fill-available;
    max-width: -moz-available;
}

table input {
  width:100%;
}

 table {
    border-collapse: collapse;
    margin: 25px 0;
    font-size: 0.9em;
    font-family: sans-serif;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    width:100%;
}
table.rpt {
  box-shadow: none;
}

table thead tr {
    background-color: #009879;
    color: #ffffff;
    text-align: left;
}
table.rpt thead tr {
  background-color: initial;
  color: initial;
  border-bottom: 2px solid black;
}

table th,
table td {
    padding: 12px 15px;
}

table tbody tr {
    border-bottom: 1px solid #dddddd;
}

table.rpt tbody tr {
    border-bottom: 1px dashed #000000;
}

table tbody tr:nth-of-type(even) {
    background-color: #f3f3f3;
}

table.rpt tbody tr:nth-of-type(even) {
    background-color: initial;
}

table tbody tr:last-of-type {
    border-bottom: 2px solid #009879;
}

table.rpt tbody tr:last-of-type {
    border-bottom: initial;
}

table.rpt tbody tr td {
    border-right: 1px solid #000000;
}

table.rpt tbody tr td:last-of-type {
    border-right: initial;
}

table.rpt thead tr td {
    font-weight: bold;
    border-right: 1px solid #000000;
}

table.rpt thead tr td:last-of-type {
    border-right: initial;
}

table tbody tr:hover {
    color: #009879;
}

table.rpt tbody tr:hover {
    font-weight: initial;
    color: initial;
}

table.rpt tbody, table.rpt thead {
  border: 2px solid black
}

td .action {
  margin: auto;
}

.colhead {
  width: 30%;
  margin-right: 5px;
}

.colvals{
  max-width: 70%;
}

.repdetail {
  padding: 0 1rem 1rem;
}

p.subtext {
  margin-top: 1rem;
  color: initial;
}

header .row {
  display: flex;
  align-items: center;
  padding: 0 0.5rem;
}

header .row h2 {
  flex: auto;
  margin: 0;
}

header .row img {
  padding: 0.25rem 0.5rem;
}

span.action {
  cursor: pointer;
}

footer {
  position: fixed;
  bottom: 0;
  text-align: center;
  width: 100%;
  padding-bottom: 1rem;
  font-size: small;
}

.rephead {
  position: fixed;
  top: 0;
  width: 99%;
}

.a-right {
  flex-direction: row-reverse;
  width: initial;
}

.bigboy {
  font-size: 20em;
}

.a-center {
  width: 100%;
  height: 100%;
  margin:auto;
}

.tblBtn {
  margin-top: 2px;
  margin-bottom: 2px;
}

.tblsep {
  opacity: 0%;
  height: 5px;
}

#lines tr td input {
  min-width: 80px;
}

[data-slots] { font-family: monospace }

.uc {
    text-transform: uppercase;
}

input[type=submit]:disabled {
  background-color: lightgray;
}

.ul {
  text-decoration: underline;
}