.timecapsule {
  border: inherit;
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-areas:
    "header image"
    "header image"
    "about image";
  margin: auto;
  align-items: baseline;
  p {
    margin: 0px;
  }
}

@media all and (max-width: 850px) {
.timecapsule {
  border: inherit;
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-areas:
    "header header"
    "about image";
}
}

@media all and (max-width: 500px) {
  .timecapsule {
  border: inherit;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas:
    "header"
    "about"
    "image";
}
}

.capsule_header {
  grid-area: header;
  margin-top: 6px;
  margin-bottom: 6px;
  border: inherit;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding-left: 5px;
  padding-right: 5px;
}

.capsule_about {
  grid-area: about;
  margin-top: 6px;
  margin-bottom: 6px;
  border: inherit;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding-left: 5px;
  padding-right: 5px;
}

.capsule_image {
  grid-area: image;
  margin-top: 6px;
  margin-bottom: 6px;
  border: inherit;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding-left: 5px;
  padding-right: 5px;
}