.hero {
  width: 100%;
  height: 500px;
}

.hero-bg {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  animation: slideBg 12s infinite;
}

@keyframes slideBg {

  0% {
    background-image: url("../img/setgambar.jpeg");
  }

  33% {
    background-image: url("../img/setgambar2.jpeg");
  }

  66% {
    background-image: url("../img/setgambar3.jpeg");
  }

  100% {
    background-image: url("../img/setgambar.jpeg");
  }
}