/* Adapting the media for a phone screen */
@media only screen and (max-width: 768px) {
  .flex-item-left, .flex-item-center {
    flex: 50%;
  }
  .flex-item-right {
    text-align: left;}
  .langButton{font-size: 18px;margin-right: 16px;}
  .cross{width: 3px;height: 90vw;}
  .letters{font-size: 28vw; width:85% ; height:70%; padding-top: 15%; left: -37%}

  letterA, letterL, letterH, letterG {transform:  translate(0%,-60%);}
  letterA{}
  letterH{}
  letterG{}
  letterL{padding-top:15vw;}
  .navCross{display: none;}
  .hamburger-icon{display: block;}
  .body{flex-direction: column;}
  .pageTitle{font-size: 40px; height:15vw; width: 55vw; padding: 0; margin-bottom: 5vw; }
  .sectionTitle{font-size: 30px; left:30vw}
  /* .navCross{margin-top:5vw; right:3vw; width:80px; height: 80px;} */
}

@media only screen and (max-width:500px) {
  .flex-item-right, .flex-item-left, .flex-item-center {
  flex: 100%;}
  .flex-item-right {
    text-align: left;
  }
}