html {
  scroll-padding-top: 70px;
}
section {
  background-color: darkslateblue;
  color: white;
  width: 100%;
}
#hero-section {
  width: 100%;
  height: 100%;
  padding: 150px 0 150px 0;
  color: white;
  text-align: center;
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    url(img/galactic.png);
  background-attachment: fixed;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#headshot {
  width: 200px;
  border: 5px solid cornflowerblue;
  border-radius: 50%;
}

.skill-image {
  width: 200px;
  height: 200px;
}

.contact-button {
  font-size: 100px;
}

@media (hover: hover) {
  .skill-image {
    filter: grayscale(50%) !important;
    transition: all 0.25s ease;
  }

  .skill-image:hover {
    filter: grayscale(0%) !important;
  }

  .contact-button {
    filter: invert(100%) !important;
    transition: all 0.25s ease;
  }

  .contact-button:hover {
    filter: invert(0%) !important;
  }
}

/* #carousel-inspirationCarousel { */
/*   height: 300px; */
/* } */
/**/
/* .carousel-item { */
/*   overflow: hidden; */
/*   object-fit: cover; */
/* } */
/**/
/* .carousel-caption { */
/*   background-color: rgba(0, 0, 0, 0.7); */
/*   overflow: auto; */
/* } */