*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: sofia-pro-condensed, sans-serif;
  font-weight: 300;
  font-style: normal;

}
main {
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-auto-rows: max-content;
  grid-gap: 64px;
  margin-top:  32px;
  margin-left: 16vw;
  margin-right: 16vw;
}
main h1 {
  grid-row: 1;
  grid-column: 1 / -1;
}
main h1 a {
  color: #707070;
  letter-spacing: .1rem;
  text-transform: capitalize;
  text-decoration: none;
}
main h2 {
  font-size: 18px;
}
main section:nth-of-type(1) {
  display: grid;
  grid-template-columns: min-content 1fr;
  grid-template-rows: 1fr;
  grid-column-gap: 16px;
  grid-row: 2;
  grid-column: 1;
}
main section:nth-of-type(1) h2 {
  color: #90ADA0;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  text-align: right;
  text-transform: capitalize;
  letter-spacing: .2rem;
}
main section:nth-of-type(1) img {
  width: 256px;
}
main section:nth-of-type(2) {
  display: grid;
  grid-template-columns: min-content 1fr;
  grid-template-rows: 1fr;
  grid-column-gap: 16px;
  grid-row: 2;
  grid-column: 2;
}
main section:nth-of-type(2) h2 {
  color: #90ADA0;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  text-transform: capitalize;
  letter-spacing: .2rem;
  align-self: center;

}
main section:nth-of-type(2) p {
  align-self: center;
}
main section:nth-of-type(2) p a {
  text-decoration: none;
  color: inherit;
}
main section:nth-of-type(3) {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  grid-row-gap: 16px;
  grid-row: 3;
  grid-column: 2;
}
main section:nth-of-type(3) h2 {
  color: #90ADA0;
  letter-spacing: .2rem;
  text-align: right;
  grid-column: 2;
  grid-row: 1;
}
main section:nth-of-type(3) a {
  color: #707070;
  text-decoration: none;
  letter-spacing: .1rem;
  font-size: 12px;
  text-align: right;
  grid-column: 2;
  grid-row: 2;
}
main section:nth-of-type(3) p:nth-of-type(1) {
  color: #707070;
  font-size: 12px;
  text-decoration: none;
  letter-spacing: .1rem;
  text-align: left;
  grid-column: 1;
  grid-row: 2;
}
main section:nth-of-type(3) p:nth-of-type(2) {
  color: #707070;
  font-size: 12px;
  text-decoration: none;
  letter-spacing: .1rem;
  text-align: left;
  grid-column: 1;
  grid-row: 3;
}
main section:nth-of-type(3) p:nth-of-type(3) {
  color: #707070;
  font-size: 12px;
  text-decoration: none;
  letter-spacing: .1rem;
  text-align: right;
  align-self: flex-end;
  grid-column: 2;
  grid-row: 3;
}
main section:nth-of-type(4) {
  grid-row: 4;
  grid-column: 1 / -1;
}
main section:nth-of-type(4) h2 {
  font-size: 10px;
  color: #AAAAAA;
  text-align: right;
  margin-top: 16px;
  margin-bottom: 16px;
}
@media (orientation: portrait) {
  main {
    grid-template-columns: 1fr;
  }
  main section:nth-of-type(1) {
    grid-column: 1;
    grid-row: 2;
  }
  main section:nth-of-type(2) {
    grid-column: 1;
    grid-row: 4;
  }
  main section:nth-of-type(3) {
    grid-column: 1;
    grid-row: 3;
  }
  main section:nth-of-type(4) {
    grid-column: 1;
    grid-row: 5;
  }
}
@media (orientation: landscape) and (max-height: 414px) {
  main {
    grid-template-columns: 1fr;
  }
  main section:nth-of-type(1) {
    grid-template-columns: 1fr 1fr;
    grid-column: 1;
    grid-row: 2;
    justify-content: center;
  }
  main section:nth-of-type(1) h2 {
    justify-self: flex-end;
  }
  main section:nth-of-type(2) {
    grid-column: 1;
    grid-row: 4;
  }
  main section:nth-of-type(3) {
    grid-column: 1;
    grid-row: 3;
  }
  main section:nth-of-type(4) {
    grid-column: 1;
    grid-row: 5;
  }
}
