_print.scss

@media print {
  :root {
    font-size: 12px;
  }

  main {
    font-size: 16px;
    margin-bottom: 0;
    & > section {
      margin-bottom: 1rem;
      &:last-child {
        margin-bottom: 0;
      }
    }
  }
  footer {
    display: none;
  }

  h5 {
    margin-bottom: 0.25rem;
  }
  ul {
    margin-bottom: 0.25rem;
  }

  .experience,
  .education {
    ul,
    details {
      margin: 0.5rem 0;
      font-size: small;
    }
  }

  details {
    & summary {
      visibility: hidden;
      transform: translate(-1em, -3.5px);
      // 1em is to cancel out the hidden control
      // No idea why 3.5px
      & span {
        text-decoration: none !important;
      }
      & > .svg-inline--fa {
        visibility: visible;
        position: absolute;
        top: 0;
        left: 1em;
      }
    }
    &[open] summary {
      position: absolute;
    }
    &:not([open]) summary {
      & > span {
        visibility: visible;
        line-height: 0.9em;
        padding-left: 1.5rem;
      }
    }
  }
}

@page {
  margin: 0;
  size: A4 portrait;
}