/* Used "Legacy" from https://wdexplorer.com/20-examples-beautiful-css-typography-design/
   as a starting point. */

a,a:visited {
    color: #93291b;
    text-decoration: none;
    font-weight: 600;
}

a:hover {
    text-decoration: underline
}

h1 {
    font-family: 'Enriqueta', arial, serif;
    line-height: 1.25;
    margin: 0 0 10px;
    font-size: 40px;
    font-weight: bold;
}

h1 a,

h1 a:visited {
    color: #333333
}

h1 a:hover {
    color: #93291b;
    text-decoration: none;
}

body {
   font-family: "Helvetica Neue",Arial,sans-serif;
   font-size: 16px;
   font-weight: 300;
   line-height: 1.5625;
}

p {
    color: #333333;
    font-family: "Helvetica Neue",Arial,sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.5625;
    margin-bottom: 15px;
}

.alert {
    font-size: 24px;
    font-weight: 900;
}

th {
    color: #333333;
    font-family: "Helvetica Neue",Arial,sans-serif;
    font-size: 16px;
    line-height: 1.5625;
}

td {
    color: #333333;
    font-family: "Helvetica Neue",Arial,sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.5625;
}

.light-block {
    background-color: #fff8e8;
    border-top: 2px solid black;
}

.dark-block {
    background-color: #ffd15e;
    border-top: 2px solid black;
}

.vertical-pad {
    padding-top: 10px;
    padding-bottom: 10px;
}

.pretty-table {
    border-collapse: collapse;
    border-top: 10px;
}

.table-centered {
    margin: 0 auto;
}

.pretty-table tr:nth-child(odd) {
    background-color: #ffd15e;
}

.pretty-table tr:nth-child(even) {
    background-color: #fff8e8;
}

.pretty-table td {
    padding: 10px;
}

.pretty-table th {
    background-color: #ffad73;
    border-top: 2px solid black;
    border-bottom: 2px solid black;
}

.pretty-table tr:last-child {
    border-bottom: 2px solid black;
}

.pretty-table .spacer {
    background-color: #ffffff;
    border-top: 2px solid black;
}

.form-table {
    width: 100%;
}

.form-table td {
    border-top: 2px solid black;
}

.form-table .header {
    background-color: #ddd;
    border-left: 2px solid black;
    border-right: 2px solid black;
}

.form-table .fixed {
    font-weight: 900;
}

.form-table input,textarea {
    width: 500px;
}

.form-table-narrow {}

.form-table-narrow td {
    border-top: 2px solid black;
    padding-left: 6px;
    padding-right: 6px;
}

.form-table-narrow th {
    padding-left: 6px;
    padding-right: 6px;
}

.form-table-narrow .header {
    background-color: #ddd;
    border-left: 2px solid black;
    border-right: 2px solid black;
}

.form-table-narrow .fixed {
    font-weight: 900;
}

.line-number {
    font-weight: 900;
    text-align: center;
    width: 100%;
}

#div-form-wrap {
    max-width: 80%;
    margin: 0 auto;
}

.doi-metadata-section {
    max-width: inherit;
    background-color: #ddd;
    padding: 12px;
    font-weight: 900;
    font-size: 24px;
    border: 2px solid #aaa;
    margin: 2rem 0px;
}

.form-error-box {
    background-color: #fce7e7;
    border: 2px solid #9c0404;
    font-weight: 900;
}

.link-button {
    color: #333333;
    background-color: #ffad73;
    padding: 0.25em 1em;
    border-radius: 8px;
    font-family: "Helvetica Neue",Arial,sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.5625;
    transition-duration: 0.4s;
    cursor: pointer;
}

.link-button:hover:enabled {
    background-color: #ffffff;
}

.link-button:disabled {
    background-color: #222222;
    cursor: not-allowed;
}

.centered {
    text-align: center;
}

.cr {
    width: 100%;
    text-align: center;
}

.news {
    width: 90%;
    margin: 0 auto;
    color: #333333;
    font-family: "Helvetica Neue",Arial,sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.5625;
    border: 2px solid black;
}

.news .head {
    background-color: #ffad73;
    text-align: center;
    font-weight: 600;
    padding: 5px 10px;
    border-bottom: 1px solid black;
}

.news .msg {
    background-color: #ffd15e;
    padding: 5px 10px;
}

.news .author {
    background-color: #fff8e8;
    text-align: right;
    font-weight: 600;
    padding: 10px 30px 5px 5px;
}

.line-img {
    width: 2rem;
    transition-duration: 0.4s;
    cursor: pointer;
    background: none;
}

.line-img:hover {
    background: #ffecc5;
}

.form-row {
    margin: 6px 0;
}

.midline {
    vertical-align: middle;
}

 /* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 360px;
  background-color: #555;
  color: #fff;
  text-align: center;
  padding: 5px;
  border-radius: 6px;

  /* Position the tooltip text */
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;

  /* Fade in tooltip */
  opacity: 0;
  transition: opacity 0.3s;
}

/* Tooltip arrow */
.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}