:root {
  --archive-logo: url("data:image/svg+xml,%3csvg%20height='86'%20viewBox='0%200%2076%2086'%20width='76'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='m76%2082v4h-76l.00080851-4zm-3-6v5h-70v-5zm-62.6696277-54%20.8344146.4217275.4176066%206.7436084.4176065%2010.9576581v10.5383496l-.4176065%2013.1364492-.0694681%208.8498268-1.1825531.3523804h-4.17367003l-1.25202116-.3523804-.48627608-8.8498268-.41840503-13.0662957v-10.5375432l.41840503-11.028618.38167482-6.7798947.87034634-.3854412zm60.0004653%200%20.8353798.4217275.4168913%206.7436084.4168913%2010.9576581v10.5383496l-.4168913%2013.1364492-.0686832%208.8498268-1.1835879.3523804h-4.1737047l-1.2522712-.3523804-.4879704-8.8498268-.4168913-13.0662957v-10.5375432l.4168913-11.028618.3833483-6.7798947.8697215-.3854412zm-42.000632%200%20.8344979.4217275.4176483%206.7436084.4176482%2010.9576581v10.5383496l-.4176482%2013.1364492-.0686764%208.8498268-1.1834698.3523804h-4.1740866l-1.2529447-.3523804-.4863246-8.8498268-.4168497-13.0662957v-10.5375432l.4168497-11.028618.38331-6.7798947.8688361-.3854412zm23%200%20.8344979.4217275.4176483%206.7436084.4176482%2010.9576581v10.5383496l-.4176482%2013.1364492-.0686764%208.8498268-1.1834698.3523804h-4.1740866l-1.2521462-.3523804-.4871231-8.8498268-.4168497-13.0662957v-10.5375432l.4168497-11.028618.38331-6.7798947.8696347-.3854412zm21.6697944-9v7h-70v-7zm-35.7200748-13%2036.7200748%208.4088317-1.4720205%202.5911683h-70.32799254l-2.19998696-2.10140371z'%20fill='%23fcfcfc'%20fill-rule='evenodd'/%3e%3c/svg%3e");
}

#archive-org {
  width: 100%;

  background-color: #eee;

  hgroup {
    background-color: #0a0a0a;
    color: white;
    h2,
    h1,
    p {
      font-family: Effra;
    }
  }

  > hgroup {
    position: relative;

    &::after {
      content: "archive";
      font-size: 0;
      position: absolute;
      display: block;

      width: 75px;
      height: 60px;
      right: 00px;
      top: 2px;
      z-index: 100;

      background-image: var(--archive-logo);
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;

      transform: rotatez(6deg);
    }
  }
}

.archive-list-container {
  width: 100%;
}

.archive-list {
  --thumb-width: 130px;

  display: flex;
  flex-flow: row wrap;

  justify-content: center;
}

.archive-item {
  width: var(--thumb-width);
}

.archive-thumb {
  width: var(--thumb-width);
}

.archive-info {
}

.archive-title {
}