@page {
  size: letter portrait;
  margin: 0.25in;
}

a::after {
  content: " (" attr(href) ")";
}

a {
  color: black;
  text-decoration: none;
}
body {
  margin: 0;
  color: #000;
  background-color: #fff !important;
  background-image: none !important;
}

div.content {
  overflow: hidden;

  background-color: #fff;

  max-width: none;
  width: 100%;
  margin: auto;

  border: none;
}

.header {
  display: grid;
  grid-template-columns: 25% 75%;
  width: 100%;
}

#logo img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding-left: initial;
  width: 2in;
}

.introduction {
  place-self: center stretch;
  text-align: right;
}

.introduction h2 {
  font-size: large;
  margin-top: 0.2em;
  margin-bottom: 0.2em;
}

.introduction p {
  margin-top: 0.1em;
  margin-bottom: auto;
}

.resume {
  display: grid;
  width: 100%;
  grid-template-columns: 1.1in 0.5fr 0.5fr 0.5fr;
  grid-template-areas:
    "qr_codes languages buzzwords skills"
    "qr_codes education education certs"
    "experience experience experience experience";

  font-size: 12px;
}

.qr_codes {
  height: 100%;
	align-self: stretch;
  justify-self: left;
  grid-area: qr_codes;

  display: flex !important;
  flex-direction: column;
  justify-content: space-around;
  column-gap: .1in;
}

.qr_codes img {
  width: 1in;
}

.resume h1 {
  margin-top: 5px;
  border-bottom: 2.5px solid;
  font-size: 14px;
}

.resume ul {
  margin: 0;
}

.certs {
  grid-area: certs;
}

.certs img {
  height: .5in;
}

.skills {
  grid-area: skills;
}

.languages {
  grid-area: languages;
}

.buzzwords {
  grid-area: buzzwords;
}

.boxes ul {
  display: block;
  list-style-type: disc;
  margin-block-start: 0.5em;
  margin-block-end: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
  padding-inline-start: .25in;
}

.boxes li {
  display: list-item;
  text-align: -webkit-match-parent;
  justify-content: initial;
  align-items: initial;
  text-align: initial;

  margin: initial;
  min-width: initial;
  padding: initial;
  border: none;
  box-shadow: none;
}

#jobs {
  grid-area: experience;
}

#jobs h1 {
  margin-top: 0;
}

.experience {
  margin: 6px;
  padding: 0px;
  box-shadow: none;
  border: none;
  break-inside: avoid;
}

.experience h2 {
  font-size: 12px;
  margin-top: 0.1em;
}

.experience h3 {
  font-size: 12px;
  margin-bottom: 0.2em;
}

.experience p {
  margin-top: 0.1em;
  margin-bottom: 0.1em;
}

.education {
  grid-area: education;
}

.print_only {
  display: initial;
}
.web_only {
  display: none;
}