.active{
  color: #10b981 !important;
}

.custom-btn {
  text-decoration: none;
  background-image: url("../img/button.png");
  background-repeat: no-repeat;
  background-position: left;
  padding: 0 70px;
}

.hero-container {
  background-image: url("../img/hero4.png");
  background-repeat: no-repeat;
  background-position: top;
  background-size: cover;
  min-height: 100vh;
}

.review-star {
  color: orange;
  font-size: 27px;
}

.card:hover {
  cursor: pointer;
}

.banner {
  background-image: url("../img/banner/b2.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
  height: 250px;
}

.shop-banner {
  background-image: url("../img/banner/b1.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
  height: 300px;
}

.blog-banner {
  background-image: url("../img/banner/b19.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
  height: 300px;
}

.about-banner {
  background-image: url("../img/about/banner.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
  height: 300px;
}

.blog-img {
  max-height: 340px;
  width: 400px;
}

.app-img {
  border: 1px solid green;
}

@media screen and (max-width: 576px) {
  .hero-container {
    background-position: bottom;
  }
}