
@keyframes heroFade {
  0%   { background-image: url("/images/about-images-1.jpg"); opacity: 1; }
  20%  { background-image: url("/images/about-images-1.jpg"); opacity: 1; }
  25%  { background-image: url("/images/about-images-1.jpg"); opacity: 1; }

  25%  { background-image: url("/images/about-images-2.jpg"); opacity: 1; }
  30%  { background-image: url("/images/about-images-2.jpg"); opacity: 1; }
  45%  { background-image: url("/images/about-images-2.jpg"); opacity: 1; }
  50%  { background-image: url("/images/about-images-2.jpg"); opacity: 1; }

  50%  { background-image: url("/images/about-images-3.jpg"); opacity: 1; }
  55%  { background-image: url("/images/about-images-3.jpg"); opacity: 1; }
  70%  { background-image: url("/images/about-images-3.jpg"); opacity: 1; }
  75%  { background-image: url("/images/about-images-3.jpg"); opacity: 1; }

  75%  { background-image: url("/images/about-images-4.jpg"); opacity: 1; }
  80%  { background-image: url("/images/about-images-4.jpg"); opacity: 1; }
  95%  { background-image: url("/images/about-images-4.jpg"); opacity: 1; }

  100% { background-image: url("/images/about-images-1.jpg"); opacity: 1; }

}

.about-us-image {
  display: block;
  max-width: 300px;
  height: auto;
  margin: 20px auto;
  border: solid 5px #ffffff2f;
}

.contact-us-button {
    display: block;
    margin: 100px auto 0 auto;
}