@media (max-width: 480px) {
    .hero{
      min-height: 40vh;
      background-position: 50%;
    }
    .hero .overlay{
      height: 40vh;
    }
    #portfolio-carousel{
      max-width: 100%;
    }
    .about p{
      color: var(--bs-white);
      text-align: center;
    }
    .about h1{
      text-align: center;
      color: var(--bs-custom-blue);
    }
    #contact-form{
      width: 100%;
    }
    .section-header-white{
        text-align: center; 
        color: var(--bs-white);
    }
}

@media (min-width: 481px) {
  #contact-form{
    width: 50%;
  }
}