@media (max-width: 850px) {
  #hamburger {
    display: block;
  }
  .nav-items {
    display: none;
  }

  .main-heading {
    font-size: 56px;
  }

  .sub-heading {
    font-size: 18px;
  }

  .hero {
    justify-content: center;
    margin: auto;
    top: 30%;
    left: 50%;
    transform: translate(-50%);
    text-align: center;
  }
  .nav-bar {
    padding: 20px 20px 0px 20px;
  }
  .hero-section {
    height: 100vh;
    width: 100vw;
  }

  .menu {
    display: flex;
  }
}