body {
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: 9% 36.33% 54.66%;
    grid-template-areas: 
        "header"
        "intro" 
        "main";
}

.index-intro {
  display: grid;
  position: relative;
  grid-area: intro;
  height: 38%;
  min-height: 18em;
  background-color: #36454F;
  padding-left: 2.0em;
  align-items: top;
  z-index: 2;
}

.wrapper {
  display: grid;
  grid-area: wrapper;
  grid-template-columns: auto auto;
  grid-template-rows: auto auto;
  justify-content: center;
  align-items: center;
  column-gap: 1.0em;
  margin: 0.0em auto;
}

main {
    display: grid;
    margin: 0.0 auto;
    position: relative;
    word-wrap: wrap;
    max-width: 50em;
    font-size: 1.6em;
    grid-area: main;
}