body,
header {
  background-color: var(--sand); }

section {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: auto;
  column-gap: var(--mainpad); }
  @media (max-width : 900px) {
    section {
      grid-template-columns: repeat(4, 1fr);
      row-gap: calc(2 * var(--mainpad)); } }
  section div.careerstext {
    font-size: var(--fontMedium); }
    section div.careerstext p:not(:last-child) {
      margin-bottom: 1em; }
    section div.careerstext[active] {
      grid-column: 1/6;
      margin-bottom: 3em; }
      @media (max-width : 900px) {
        section div.careerstext[active] {
          grid-column: 1/5; } }
    section div.careerstext[default] {
      grid-column: 1/13;
      margin-bottom: 4em;
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-auto-rows: auto;
      column-gap: var(--mainpad); }
      @media (max-width : 900px) {
        section div.careerstext[default] {
          grid-template-columns: repeat(4, 1fr);
          row-gap: calc(2 * var(--mainpad)); } }
      section div.careerstext[default] p {
        grid-column: 1/6; }
      section div.careerstext[default] > div {
        grid-column: 9/13;
        display: flex;
        flex-direction: column;
        grid-row: 1; }
      @media (max-width : 900px) {
        section div.careerstext[default] {
          grid-column: 1/5; }
          section div.careerstext[default] p {
            grid-column: 1/5; }
          section div.careerstext[default] > div {
            grid-column: 1/5; } }
  section ul {
    grid-column: 1/13;
    margin-bottom: 2em;
    font-size: var(--fontMedium); }
    @media (max-width : 900px) {
      section ul {
        grid-column: 1/5;
        font-size: 1rem; } }
    section ul li {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-auto-rows: auto;
      column-gap: var(--mainpad);
      padding: 0.5em 0;
      border-bottom: 1px solid currentColor; }
      @media (max-width : 900px) {
        section ul li {
          grid-template-columns: repeat(4, 1fr);
          row-gap: calc(2 * var(--mainpad)); } }
      section ul li span:first-child {
        grid-column-end: span 4; }
        @media (max-width : 900px) {
          section ul li span:first-child {
            grid-column-end: span 2; } }
      section ul li span:nth-child(2), section ul li span:nth-child(3) {
        grid-column-end: span 3; }
        @media (max-width : 900px) {
          section ul li span:nth-child(2), section ul li span:nth-child(3) {
            display: none; } }
      section ul li span:last-child {
        grid-column-end: span 2; }
        @media (max-width : 900px) {
          section ul li span:last-child {
            grid-column-end: span 2; } }
      section ul li a {
        grid-column-end: span 2; }
        @media (max-width : 900px) {
          section ul li a {
            grid-column-end: span 2; } }
img {
  grid-column: 1/13;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center; }
  @media (max-width : 900px) {
    img {
      grid-column: 1/5; } }
