body {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  background-color: #efefef;
  align-content: stretch;
  font-family: Lato, Helvetica, Consolas, Monaco, Arial, sans-serif;
}

header {
  display: flex;
  background-color: #273c75;
  box-shadow: 0px 2px 0px rgba(0,0,0,.09);
  padding: .89em 0;
  align-items: center;
}

header a {
  margin: 0 3em;
  font-weight: bold;
  text-decoration: none;
  color: #fff;
  border-radius: 3px;
  padding: .89em;
}

header a:not(.selected):hover {
  background-color: #336699;
  color: #efefef;
}

header a.selected {
  cursor: none;
  pointer-events: false;
  color: #999;
}

main {
  display: flex;
  flex: 1;
  align-content: stretch;
  padding: .89em;
}

author-cycle {
  background-color: #fefefe;
  border-radius: 3px;
  box-shadow: 0px 2px 0px rgba(0,0,0, .05);
  padding: 3.89em;
  display: flex;
  flex: 1;
  align-content: stretch;
}

author-cycle {
  display: flex;
  flex: 1;
}

code {
  font-family: 'Fira Code', monospace;
  white-space: pre;
  font-size: 150%;
}

.code {
  display: flex;
  align-self: stretch;
  width: 100%;
  border-radius: 3px;
  color: #fefefe;
  background-color: #333;
  margin: .89em 0;
  padding: .89em;
  text-shadow: 1px 1px 0px #111;
}

.home {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  /* flex-grow: 1; */
  flex-wrap: wrap
}

.home > div {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 30%;
  margin: .49em;
}

table {
  /* margin: 0 .89em; */
  border-spacing: 0;
  border-collapse: collapse;
}

table tbody tr:hover {
  background-color: rgba(116, 185, 255, .05);
}

table thead tr td {
  font-weight: 900;
  padding: 0 0 .89em 0;
  border: 0;
}

table tbody tr td:last-of-type {
  padding-left: .89em;
}

table tbody tr td {
  vertical-align: top;
  border-top: 1px solid #efefef;
  padding: .89em 0;
}

table tbody tr td:first-of-type {
  color: #333;
}

table tbody tr td:last-of-type {
  color: #999;
}

.role_everyone {
  opacity: .7;
}

.editor label {
  font-weight: 900;
  display: block;
}

.editor input, .editor textarea {
  width: 100%;
  margin: .89em 0;
  font-size: 12pt;
  padding: .89em;
}

.editor button {
  background-color: #44bd32;
  color: #fff;
  font-size: 1vh;
  border: 0;
  border-radius: 3px;
  padding: .89em;
  pointer-events: none;
}

.permission_granted {
  color: #44bd32;
}

.permission_denied {
  color: #d63031;
}

article {
  max-width: 1000px;
}
