@media screen and (min-width: 500px) {
  header .nav-bar {
    width: 100%;
  }
  header .nav-bar .logo {
    width: 40%;
  }
  main .landing-page .ImgContainer {
    display: flex;
    justify-content: center;
    padding: 10px;
  }
  .hamburger {
    margin-right: 3%;
  }
  header #topnav {
    width: 100%;
  }
  /* ABOUT CONTAINER */
  #about {
    width: 100%;
  }
  #about .ImgContainer {
    display: flex;
    justify-content: center;
    padding: 10px;
  }

  /* SERVICES CONTAINER */
  #service .serviceContainer {
    width: 100%;
  }
  #service .serviceContainer .subHeader {
    margin-top: 10%;
  }
  #service .serviceContainer h1 {
    margin-bottom: 10%;
  }
  #service .services {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    place-self: center;
  }
  #service .services {
    grid-auto-rows: 2fr;
    align-items: stretch;
  }
  #service .services .service {
    width: 400px;
    place-content: center;
  }

  /* PROOF SECTION */
  #proof .proofContainer {
    width: 100%;
  }
  /* QUOTE SECTION */

  #quote .quoteContainer {
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  #quote .quoteContainer .form {
    width: 60%;
    min-height: 50vh;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    place-self: center;
    margin-bottom: 10%;
    margin-top: -5%;
  }

  /* TESTIMONY SECTION */
  #testimony .testimonyContainer {
    width: 100%;
  }
  #testimony .testimonyContainer .subHeader {
    margin-top: 2%;
  }

  /* CONTACT SECTION */

  #contact .contactContainer {
    width: 100%;
  }
  #contact .contactContainer .subHeader {
    margin-bottom: 2%;
  }
  #contact .contactContainer .companyInfo {
    width: 90%;
    display: grid;
    grid-template-columns: repeat(2, auto);
    gap: 20px;
    place-self: center;
  }

  /* FOOTER SECTION */

  #footer .footerContainer {
    width: 100%;
  }
  #footer .footerContainer .links .companyInfo .logo .header {
    font-size: var(--subHeader-size);
    width: 50%;
  }

  /* ABOUT PAGE */

  #staff .staffContainer .staffs,
  #aboutSection,
  #staff .staffContainer {
    width: 100%;
  }
  #staff .staffContainer .staffs {
    width: 70%;
  }
}
