main {
  background-image: url(/images/halftone2.png);
}

.legacy {
  width: 80vw;
  margin: 0 auto;
  padding: 5% 0;
}

.legacy h1,
.legacy h2 {
  text-align: center;
}

.legacy {
  display: flex;
  flex-direction: column;
  gap: 5%;
}

.legacy img {
  object-fit: contain;
  max-width: 100%;
}

.legacy-image-left {
  float: left;
  margin-right: 2%;
  width: 45%;
  clear: both;
}

.legacy-image-right {
  float: right;
  margin-left: 2%;
  max-width: 45%;
  clear: both;
}

hr {
  width: 100%;
  margin: 5% 0;
}

/* ----------------- # ---------------- */
@media (min-width:1000px) {
  .legacy {
    width: 80vw;
  }

  .legacy {
    flex-direction: row;
    gap: 5%;
  }
}

@media (min-width:1400px) {
  .legacy {
    width: 60vw;
  }
}