.cards {
  display: grid;
  font-size: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(40ch, 100%), 1fr));
  grid-auto-flow: row;
  grid-template-rows: repeat(2, auto);
}
.card {
  border-top: 0.3rem solid #F8F8F2;
  border-bottom: 0.3rem solid #F8F8F2;
  border-left: 0.2ch solid #F8F8F2;
  border-right: 0.2ch solid #F8F8F2;
  padding: 0.6rem 1.4ch 0.6rem 1.4ch;
  margin: 0.6rem 0.4ch 0.6rem 0.4ch;
  display: inline-block;
}
  
.experience {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.experience .title {
  margin: 0px;
}
.experience .company {
  text-transform: uppercase;
  font-weight: bold;
  margin: 0px;
  color: #ccc;
}
.experience .time {
  margin: 0px;
  color: #aaa;
}
.experience .description {
  flex-grow: 1;
}
.experience .keywords {
  display: flex;
  text-transform: uppercase;
  flex-direction: row;
  column-gap: 2ch;
  row-gap: 0ch;
  margin: 0px;
  flex-wrap: wrap;
  color: #44475A;
  line-height: 1.5rem;
}
.experience .keywords > span {
  margin: 0px 0px 0px 0px;
}
  
    .blogsummary h3,.link,.date {
      margin: 0px;
    }
    .blogsummary {
      display: flex;
      flex-direction: column;
      height: 100%;
    }
    .blogsummary .summary {
      flex-grow: 1;
    }
  
.book {
  display: grid;
  grid-template: 1fr /
    max-content
    auto;
  grid-template-areas: "toc content";
  margin: auto;
  max-width: 100%;
}
.content {
  grid-area: content;
  font-size: 1rem;
  padding: 1.5rem 2ch 4.5rem 2ch;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow-x: scroll;
}
.content .title {
  margin-bottom: 0px;
}
.toc {
  grid-area: toc;
  padding-top: 1.5rem;
  background-color: #44475A;
}
.toc a {
  display: block;
  color: inherit;
  box-sizing: border-box;
  font-size: 1rem;
  padding: 0px 2ch 0px 2ch;
}
.toc a:hover {
  background-color: #54576A;
}
@media screen and (max-width: 100vh) {
  .book {
    grid-template: min-content / 1fr;
    grid-template-areas: "toc" "content";
  }
  .toc {
    padding-bottom: 1.4rem;
  }
  .content {
    padding-top: 1.5rem;
    max-width: 100vw;
  }
}