.tp-caption.mx-auto.tp-caption-summary{
  font-size: 20px!important;
  color :#fff!important;
  opacity: 1!important;
  line-height: 1.8!important;
}

.gs-quote{
  border-left: 6px solid #cecece;
  padding-left: 20px;
  margin-left: 10px;
}

.gs-clienttop{
  border-top: 1px solid #cecece;
  padding-top: 30px;
}

/* ==== COLOR VAR ==== */
.bg-base-color, .btn.btn-base-color{
  background-color: var(--main-theme);
  color: var(--main-font);
}

.text-base-color, .btn-link.text-base-color{
  color: var(--main-theme);
}


.navbar .navbar-nav .nav-item:hover .nav-link, .navbar .navbar-nav .nav-item.active .nav-link{
  color: var(--main-theme);
  opacity: 1;
}

.menu-drop:hover{
  border-color: var(--main-theme);
}

.header-light .navbar-nav .nav-link{color: var(--menu-font);}

.navbar .container-fluid{
  background-color: var(--menu-bg);
}


.about-img-sticky {
    position: sticky;
    top: 90px;
    height: fit-content;
}

.review-col{
  width: calc(25% - 20px);
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 20px;
}

.bg-gradient-bottom-dark-transparent{
  background: -moz-linear-gradient(top, rgba(0,0,0,0) 10%, rgba(0,0,0,0.90) 50%);
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.90) 50%);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.90) 50%);
}


.cutrow-2 {
  display: -webkit-box;
  -webkit-line-clamp: 3;      /* jumlah baris maksimal */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cutrow-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;      /* jumlah baris maksimal */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cutrow-4 {
  display: -webkit-box;
  -webkit-line-clamp: 3;      /* jumlah baris maksimal */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.popular-post-sidebar figure img{object-fit: cover;}

.asidesticky{
  position: sticky;
  top: 100px;
  height: fit-content;
}

.hdetail{
  font-size: 2.5rem;
}
/* ================== RESPONSIVE ==================== */
@media screen and (max-width:1199px){

  .sid::before{
    height: 100%;
    width: 100%;
    margin-left: 0px;
  }

  .review-col{
  width: calc(33% - 20px);
  }
}


@media screen and (max-width:991px){

 .about-img-sticky{
    position: relative;
    top:0px;
  } 
  .review-col{
   width: calc(100% - 20px);
  }


  .asidesticky{
  position: relative;
  top: unset;
  }
}

footer a{
  color: #fff;
}

.popular-post-sidebar figure img{
  height: 100%;
}