html, body {
  display: flex;
  flex-direction: column;
  min-width: 100%;
  max-width: 2048px;
  min-height: 100vh;
  margin: 0; }
  html a, body a {
    text-decoration: none; }
  html a:hover, body a:hover {
    text-decoration: underline; }
  html .header-wrapper, body .header-wrapper {
    height: 300px;
    width: 100%; }
    html .header-wrapper .left-column, html .header-wrapper .right-column, body .header-wrapper .left-column, body .header-wrapper .right-column {
      display: block;
      height: 300px; }
    html .header-wrapper .header, body .header-wrapper .header {
      position: absolute;
      top: 50px;
      left: 0;
      right: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 200px;
      width: 870px;
      color: black;
      background-color: white;
      padding: 20px 50px;
      margin: 0 auto;
      border: 3px black solid;
      z-index: 9999; }
      html .header-wrapper .header h1, body .header-wrapper .header h1 {
        font-size: 48px;
        margin: 10px 0; }
      html .header-wrapper .header hr, body .header-wrapper .header hr {
        width: 250px; }
      html .header-wrapper .header h2, body .header-wrapper .header h2 {
        font-size: 30px;
        font-weight: 500;
        margin: 10px 0; }
      html .header-wrapper .header h3, body .header-wrapper .header h3 {
        font-size: 16px;
        font-weight: 400; }
        html .header-wrapper .header h3 a, body .header-wrapper .header h3 a {
          color: green; }
      html .header-wrapper .header h4, body .header-wrapper .header h4 {
        font-size: 16px;
        font-weight: 300;
        margin: 0; }
  html .left-column, body .left-column {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: white;
    background-color: black;
    min-width: 35%;
    max-width: 35%;
    padding: 30px 0 0 30px; }
    html .left-column a, body .left-column a {
      color: white;
      z-index: 1; }
    html .left-column h4, body .left-column h4 {
      font-size: 20px;
      margin: 0 100px 0 0;
      border-bottom: 2px white solid;
      text-transform: uppercase; }
    html .left-column ul, body .left-column ul {
      padding: 0;
      margin: 0 0 20px 0; }
      html .left-column ul li, body .left-column ul li {
        margin: 5px 0;
        list-style-type: none; }
    html .left-column ul.list-with-icon li, body .left-column ul.list-with-icon li {
      display: flex;
      align-items: center; }
    html .left-column ul:not(.list-with-icon) li, body .left-column ul:not(.list-with-icon) li {
      margin: 8px 0; }
    html .left-column svg, body .left-column svg {
      font-size: 28px;
      margin-right: 10px; }
  html .right-column, body .right-column {
    display: flex;
    flex-direction: column;
    color: black;
    background-color: white;
    width: 100%;
    padding: 25px 35px; }
    html .right-column h4, body .right-column h4 {
      font-size: 24px;
      color: #003333;
      text-transform: uppercase;
      border-bottom: 2px #003333 solid;
      margin: 0 0 10px 0; }
    html .right-column .job-item, body .right-column .job-item {
      display: flex;
      font-size: 18px;
      font-weight: 500;
      margin: 16px 0 5px 0; }
      html .right-column .job-item .job-dates, body .right-column .job-item .job-dates {
        margin-left: auto; }
    html .right-column ul, body .right-column ul {
      margin: 20px 0 5px 0;
      padding-inline-start: 15px; }
      html .right-column ul li, body .right-column ul li {
        position: relative;
        list-style-type: none;
        padding-left: 5px; }
        html .right-column ul li:before, body .right-column ul li:before {
          position: absolute;
          left: -10px;
          content: '';
          height: 100%;
          width: 2px;
          background-color: #FF0000; }
        html .right-column ul li:after, body .right-column ul li:after {
          top: 2px;
          left: -15px;
          position: absolute;
          content: '';
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' viewBox='0 0 32 32' focusable='false'%3E%3Ccircle stroke='red' stroke-width='3' fill='none' cx='16' cy='16' r='10'%3E%3C/circle%3E%3C/svg%3E");
          background-repeat: no-repeat;
          background-size: contain;
          width: 12px;
          height: 12px; }
  html #main, body #main {
    display: flex;
    background-color: black; }