body {
  font-family: 'Noto Sans', sans-serif;
}
.header {
  background-color: #9C27B0;
  /*color: #E8F5E9;*/
  color: white;
  margin: -1.5rem -.5rem 0;
  padding: 1.5rem 2rem 1rem;
}
.header__name {
    max-width: 50rem;
    margin: 2rem auto 1rem auto;
}

.information__section {
  max-width: 50rem;
  margin: auto;
}
h2 {
  color: #9C27B0;
  margin-top: 1em;
  margin-bottom: .5em;
}
section > h3 {
  margin-top: .5em;
}
.information__section h2 {
    margin-left: -1rem;
    padding: 0 0 .25rem .75rem;
    border-left: .25rem solid #9C27B0; /*primary color*/
}
/*This was in Paige's design, but I'm not sure. Seems like a waste of limited
  real estate*/
/*.information__section:not(:first-of-type) h2::before {
  content: 'Contents';
  display: block;
  color: #BDBDBD;
  font-size: medium;
  margin-bottom: .5rem;
}*/
#skills ul {
  display: grid;
  grid-template-columns: 33% 33% 33%;
}

@media (max-width:490px) {
  #skills ul {
    grid-template-columns: 50% 50%
  }
}

@media print {
  * {
    -webkit-print-color-adjust: exact;
  }
  body {
    font-size: 11pt;
  }
  .information__section {
    width: 7.5in;
    /*This works because my elements just *happen* to not span weird.
     * Really should get finer control of this to make printing work correctly.
     */
    page-break-inside: avoid;
  }
  @page :first{
    margin: 0;
  }
  @page {
    margin: .75in 0 0 0;
  }
}