.react-resume {
  margin-left: auto;
  margin-right: auto;
  margin-top: 15px;
  margin-bottom: 5px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  padding: 0.20in 0.50in 0.25in 0.50in;
  box-sizing: content-box;
  background-color: rgba(51, 47, 47, 0);
  text-overflow: clip;
  overflow-y: hidden;
}

.letter {
  max-width: 8.5in !important;
  min-width: 8.5in !important;
  min-height: 11in !important;
  max-height: 11in !important;
}

.a4 {
  max-width: 210mm !important;
  min-width: 210mm !important;
  min-height: 297mm !important;
  max-height: 297mm !important;
}

.legal {
  max-width: 8.5in !important;
  min-width: 8.5in !important;
  min-height: 14in !important;
  max-height: 14in !important;
}

.react-resume h1 {
  font-size: 22px;
  margin-top: 0;
}

.react-resume h2 {
  font-size: 15px;
  padding-bottom: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

.react-resume h3 {
  font-size: 13px;
  margin: 0;
}

.resume {
  font-size: 11px;
  padding: 0;
  margin: 0;
}

.resume-header {
  text-align: center;
}

.resume-header h1 {
  margin-top: 0;
  margin-bottom: 0;
}

.resume-header hr:nth-of-type(1) {
  height: 1px;
  background-color: black;
}

.resume-header ul {
  text-align: center;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 15px;
  margin-top: 5px;
  padding: 0;
}

.resume-header li {
  list-style: none;
  display: inline;
  font-size: 13px;
}

.resume-header ul:first-of-type li::after {
  content: " | ";
  font-weight: bold;
}

.resume-header ul:first-of-type li:nth-of-type(3)::after {
  content: "";
  display: block;
}

.resume-header ul:first-of-type li:last-child::after {
  content: "";
}

.resume-header ul:nth-of-type(2) li::after {
  content: ", ";
}

.resume-header ul:nth-of-type(2) li:last-of-type::after {
  content: "";
}

.resume-header .header-icon {
  position: relative;
  top: 0.2em;
  width: 1.2em;
  height: 1.2em;
  padding: 0 0.4em;
}

.resume-experience,
.resume-professional-summary {
  text-align: left;
}

.resume-experience > ul,
.resume-education > ul,
.resume-projects > ul,
.resume-certification > ul {
  margin-left: 0;
  padding-left: 0;
}

.resume-experience > ul > li,
.resume-education > ul > li,
.resume-projects > ul > li,
.resume-certification > ul > li {
  list-style: none;
  margin-bottom: 10px;
}

.resume-experience h3:first-of-type,
.resume-education h3:first-of-type,
.resume-projects h3:first-of-type,
.resume-certification h3:first-of-type {
  display: inline-block;
  width: 70%;
}

.resume-experience h3:nth-of-type(2),
.resume-education h3:nth-of-type(2),
.resume-projects h3:nth-of-type(2),
.resume-certification h3:nth-of-type(2) {
  display: inline-block;
  width: 30%;
  text-align: right;
  vertical-align: top;
  font-size: 13px;
  font-weight: 400;
}

.resume-experience em,
.resume-experience i {
  display: block;
}

.resume-experience i {
  font-size: small;
  margin-bottom: 5px;
}

.resume-experience em {
  margin-bottom: 5px;
}

.resume-tech-skills h3 {
  margin-bottom: 5px;
}

.resume-tech-skills .grid-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.resume-tech-skills .grid-column {
  flex-basis: 50%;
  margin-bottom: 0px;
}

.tech-skills-keyword {
  width: 100%;
  height: 1.4em;
  padding: 0.1em 0;
  box-sizing: border-box;
}

.tech-skills-keyword .keyword-name {
  width: 60%;
  display: inline-block;
}

.tech-skills-keyword .keyword-level {
  width: 40%;
  display: inline-block;
}

.tech-skills-keyword .keyword-level img{
  height: 1.2em;
  width: 1.2em;
  margin: 0 0.2em;
}

.react-resume img.dark-icon {
  display: none;
}

@media (min-width: 500px) {
  .resume-tech-skills .grid-container {
    grid-template-columns: 50% 50%;
    grid-template-rows: 100%;
    margin-bottom: 0;
  }

  .resume-tech-skills .grid-column-1 {
    grid-column-start: 1;
  }

  .resume-tech-skills .grid-column-2 {
    grid-column-start: 2;
  }

  .resume-tech-skills .grid-column-1,
  .resume-tech-skills .grid-column-2 {
    margin-bottom: 0;
  }
}

@media print {
  .resume-tools {
    display: none;
  }

  .resume-edit-panel {
    display: none;
  }

  div.ad-area {
    display: none;
    margin-top: 75px;
  }

  aside, #root > div > div.ui.massive.top.attached.menu {
    display: none;
  }

  #root > .App .react-resume, #root > .App .react-resume > .resume {
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none;
  }

  #root > div > p {
    display: none;
  }

  * {
    overflow: visible !important;
  }

  @page {
    size: letter;
  }
}
