/* ARCHIVES MENU */
#main-content__archive-screen-container {
  display: grid;
  grid-template-columns: [column1-start] 80px [column1-end column2-start] 120px [column2-end column3-start] auto [column3-end column4-start] 80px [column4-end];
  grid-template-rows: [row1-start] 40px [row1-end row2-start] auto [row2-end];
  height: 100%;
  width: 100%;
  /* background-color: #000000; */
}

#main-content__archive-screen-container__sidebar {
  grid-column: column2-start / column2-end;
  grid-row: row2-start / row2-end;
}

#main-content__archive-screen-container__sidebar.option-button--left-bordered {
  width: 100%;
}

#main-content__archive-screen-container__content {
  grid-column: column3-start / column3-end;
  grid-row: row2-start / row2-end;
  margin-left: 48px;
}

.archive__content-fieldset {
  color: #ffffff;
  border: 1px solid #ffffff;
  background-color: var(--color-neutral);
  font-size: 150%;
}

.archive__content-fieldset legend {
  background-color: var(--color-neutral);
  padding: 0 8px;
}

.archive__content-fieldset label,
.archive__content-fieldset input {
  margin: 4px 0;
}

.archive__content-input--text {
  background-color: #181818;
  border: 1px solid #ffffff;
  color: var(--color-text-light);
  font-size: 100%;
  font-family: inherit;
}
.archive__content-input--button {
  background-color: #181818;
  border: 1px solid #ffffff;
  color: var(--color-text-light);
  font-size: 150%;
  font-family: inherit;
  transition-duration: var(--transition-duration-short);
}
.archive__content-input--button:hover {
  filter: brightness(1.05);
  transform: scale(1.05);
}

#main-content__archive-screen-container__content__replay-details {
  white-space: pre-line;
  display: none;
}

#archive__replay-id {
  width: 50%;
}
