body {
  background:
    radial-gradient(transparent 66%, rgba(40, 70, 95, 0.1)),
    linear-gradient(0deg, rgba(40, 70, 95, 0.1) 40px, transparent 300px),
    linear-gradient(45deg, #f1f1f2 25%, transparent 25%, transparent 75%, #f1f1f2 75%),
    linear-gradient(45deg, #f1f1f2 25%, transparent 25%, transparent 75%, #f1f1f2 75%) 2px 2px,
    linear-gradient(45deg, #f1f1f2 25%, transparent 25%, transparent 75%, #f1f1f2 75%),
    linear-gradient(45deg, #f1f1f2 25%, transparent 25%, transparent 75%, #f1f1f2 75%) 5px 5px,
    #f9f9f9;
  background-size:
    auto auto,
    auto auto,
    4px 4px,
    4px 4px,
    10px 10px,
    10px 10px;
  background-attachment: fixed;
}

.tile_container {
  margin: auto;
}

.error_heading {
  color: #6f7680;
  font-family: "utopia-std", Georgia, serif;
  font-weight: 700;
  margin: auto;
}

.header_bar {
  background-color: #3b434a;
  border-bottom: 2px solid #24282d;
  padding: 1rem;
}

.icon-toggle {
  cursor: pointer;
  display: inline-block;
  fill: #f7f8f8;
  height: 2rem;
  width: 2rem;
  margin-left: 0.5rem;
}

.icon-toggle:hover {
  fill: #b1b4b7;
}

.file-list {
  background-color: #3b434af7;
  color: #f7f8f8;
  font-size: 1rem;
  list-style-type: none;
  margin: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.5rem 0 2rem 0;
  position: absolute;
  top: 4rem;
  bottom: 0;
  left: 0;
  transition: 1s ease-in;
  max-width: 22rem;
  z-index: 1000;
}

.file-list.off-screen-left {
  left: -22rem;
}

.file-item {
  overflow: hidden;
  padding: 0.5rem 1rem 0 2rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

.file-link,
.file-link:hover {
  color: inherit;
}

.file-link.active {
  color: #fdbc11;
}

.has-expired {
  box-shadow: rgb(220, 53, 69) 0 0 0 3px;
}